zl程序教程

您现在的位置是:首页 >  前端

当前栏目

jquery的delegate实现原理[通俗易懂]

jQuery原理 实现 通俗易懂 Delegate
2023-06-13 09:11:12 时间

大家好,又见面了,我是你们的朋友全栈君。

//对标签绑定点击事件  但是 该方法对动态生成的元素无法生效
$('.btn').bind('click',function(){
          alert('点击了');
})
//jquery处理
$('document').delegate('.btn','click',function(){
       alert('点击了');
});

//其实原理就是利用了JS事件的冒泡机制 在document(或事件源的父层也可以)进行监听 冒泡到监听点后 判断事件源是否自己设定的元素
$(document).bind('click',function(e){
       var ev=e||event;
       var target=$(ev.target||ev.srcElement);
       if(target.hasClass('btn')){
                  alert('点击了');
                  return false;
       }
       return true;
});



//

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/179153.html原文链接:https://javaforall.cn