解决使用ajax请求 局部刷新页面后 绑定HTML标签的事件失效

解决使用ajax请求 局部刷新页面后 绑定HTML标签的事件失效

绑定事件为什么会失效?
缘由: 当你直接将事件绑定在指定的dom元素后 js已经执行完毕 事件也绑定完了 这个时候 绑定事件是可以正常执行的
但是 当你使用ajax刷新了你绑定的那个dom元素 所在的区域 这个时候 是没有任何绑定事件的

解决方法 可以使用事件委托  

语法:

$(委托对象ID/class).on('绑定事件','触发对象ID/class',function(evt){
     var host = $(evt.target).text();
})

注 : $(evt.target) = $(this) 当前触发对象
说明 : 获取当前触发对象的属性值比较方便
列:

<div class='list'>
<!--以下为ajax刷新区域-->
    <div class='b'>1</div>
    <div class='b'>2</div>
    <div class='b'>3</div>
 <!--以上为ajax刷新区域-->
</div>

    $('.list').on('click','.b',function(evt){
         var host = $(evt.target).text();
        console.log(host);
    })

亲测有效