当前位置：首页 → 问答吧 → jQuery使用html方法动态生成的元素为什么无法使用？

jQuery使用html方法动态生成的元素为什么无法使用？

时间：2010-01-13

来源：互联网

复制代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Insert title here</title>
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js">
</script>
<script type="text/javascript">
$(document).ready(function(){
$("#btn1").click(function(){
$("#div1").html("<a href=\"#\" id=\"demo\">动态元素</a>");
});
$("#demo").click(function(){
alert("动态HTML元素");
});
})
</script>
</head>
<body>
<input type="button" id="btn1" value="动态元素" />
<div id="div1">
</div>
</body>
</html>

将上面的代码另存为htm文件，打开点击按钮《动态元素》，在div1里面出现的a标签元素的事件为什么无效呢？

作者: x900 发布时间: 2010-01-13

顺序的问题

一开始，就没有<a  id = "dome"></a>这个元素，是点了按钮之后才创建的，所以一开始的绑定就失败了。

试着这样就可以了，当然也有其它的解决方法:
$(document).ready(function(){
                $("#btn1").click(function(){
                    $("#div1").html("<a href=\"#\" id=\"demo\">动态元素</a>");
                     $("#demo").click(function(){
                        alert("动态HTML元素");
                       });
                });

            })

初来乍到，相互学习。

作者: position 发布时间: 2010-01-13

$("#btn1").click(function(){
                    $("#div1").html("<a href=\"#\" id=\"demo\">动态元素</a>");
                });
                $("#demo").click(function(){
                    alert("动态HTML元素");
                });

因为demo是动态生成所，如果你想给他绑定事件需要用live或bind
$("#demo").live("click",function(){
                    alert("动态HTML元素");
                });

这样就没问题了

作者: ssvfdn 发布时间: 2010-01-14

jQuery使用html方法动态生成的元素为什么无法使用？

热门阅读

热门下载