当前位置: 代码迷 >> Java Web开发 >> jquery动态加载 DIV后 click事件不可用,该如何解决
  详细解决方案

jquery动态加载 DIV后 click事件不可用,该如何解决

热度:483   发布时间:2016-04-13 22:45:14.0
jquery动态加载 DIV后 click事件不可用
<!--div部分--> 
<div id="chuxian" class='zhuan' style='display: none;'>
 </div>

<!--js部分-->
<SCRIPT TYPE="TEXT/JAVASCRIPT">
   $(document).ready(function(){
$.get('/silverWeb/zhuan',{},function(data){
var object = $("#chuxian").find('.clearfix');
$.each(data,function(i,v){
var money = data[i].money;
var jishou =data[i].jishou;
var count = data[i].count;
var price = data[i].price;
var name= data[i].name;
var nums= data[i].nums;
var point= data[i].point;
var code= data[i].code;
var profit_loss= data[i].profit_loss;
var tid= data[i].tid;
var mold= data[i].mold;
var id= data[i].id;
$("#chuxian").append("<div class='clearfix' style='margin-bottom: 2px;'>"
+"<div class='zhuan_left'>"
+"<em>"+money+"</em>"
+"<span>"+jishou+"</span>"
                    +"<div>"+name+"<br>"+count+"</div>"
                    +"<i><img src='images/right.png' width='15' height='24'></i>"
+"</div>"
+"<div class='zhuan_right' price='"+price+"' name='"+name+" nums='"+nums+" point='"+point+"' code='"+code+"' profit_loss='"+profit_loss+"' tid='"+tid+"' mold='"+mold+"' id='m_zhuan_rang'>转让</div>"
+"</div>");
});
},'json');
//我用了以下四种变通方法在append拼接完div后,选取 id='m_zhuan_rang'触发click事件都不可用。我知道click事件是在页面加载时就绑定好的,后来动态添加的div触发不了click事件,但是用了好多方法都不行,请前辈们指点一下,谢谢!
//$("#m_zhuan_rang").show(function(){
    //   alert('测试数据');
    //  });
     $("#m_zhuan_rang").click(function(){
alert('测试数据');
  });
// $(".zhuan_right").live("click",function(){
    //  alert('测试数据');
// });
// $("#m_zhuan_rang").html($("#m_zhuan_rang").click(function(){
    //      alert('测试数据');
    //  }));

 });
</script> 
------解决思路----------------------
$(document).on(selector, eventType, function() {});

用 on 的方式绑定事件,可作用于新创建的 element.
  相关解决方案