js appendTo追加的input 点击事件失效 ---js

clone一个元素块appendTo到#area_tb中 

 $(".city").click(function (e) {

        SelCity(this,e);

 });   

上面的代码无效

点击的是动态添加的元素块，先找到你要点击的元素的父元素  再on中写你要绑定的事件和你要点击的元素块

<div id='area_tb'>

       <div class='city'></div>

       <div class='city'></div>

       <div class='city'></div>

</div>

如下

$("#area_tb").on('click','.city',function(e){

        SelCity(this,e);
    })

 

例二

<div class="panel-body">
    <div class="popup_tree_menu">
        <ul class="tree_menu">
<li><a class="icon" node="1"><span>空链接1</span></a></li>
<li><a class="icon" node="1"><span>空链接1</span></a></li>
<li><a class="icon" node="1"><span>空链接1</span></a></li>
<li><a class="icon" node="1"><span>空链接1</span></a></li>
<li><a class="icon" node="1"><span>空链接1</span></a></li>
        </ul>
    </div>
</div>

动态添加的是li元素  也是你要点击的元素

$(".popup_tree_menu .tree_menu").on('click','.icon',function() {
    $(".tree_menu a.active").removeClass("active");
    $(this).addClass("active");
})

例三

<div class="panel-body">
    <div class="popup_tree_menu">
        <ul class="tree_menu">
            <li class='icon'><a node='"+data.data[i].id+"'><span>"+data.data[i].title+"</span></a></li>
            <li class='icon'><a node='"+data.data[i].id+"'><span>"+data.data[i].title+"</span></a></li>
            <li class='icon'><a node='"+data.data[i].id+"'><span>"+data.data[i].title+"</span></a></li>
        </ul>
    </div>
</div>

$(".popup_tree_menu .tree_menu").on('click','.icon',function() {
    alert(123);
    $(".tree_menu li.active").removeClass("active");
    $(this).addClass("active");
})