js事件代理

事件代理在JS世界中一个非常有用也很有趣的功能。当我们需要对很多元素添加事件的时候,可以通过将事件添加到它们的父节点而将事件委托给父节点来触发处理函数。

例如:

我们对对台添加的某个元素添加点击事件,动态添加的onclick事件必须要在append追加完元素之后添加进去才管用。但是有些有些事件,不仅仅是onclick事件就可以解决的,如果在onclick事件中还有$('.normal').each(function(){ })等之类的循环,那么我们单纯的靠onclick则解决不了,因为onclick你定位不到具体的某个类的元素上
开始我是这样写的:
动态生成的元素中写了onclick事件,js中

function  aa(){
  $('.normal').each(function(){
     var _this=$(this);
    console.log('操作你的代码');
  })
}

我发现会输出两次到控制台
那么用事件代理就不会出现这些问题,他的原理是找一个不是动态添加的已有元素添加代理
如下我是给class="newshop"加的代理
给exchangeId添加的点击事件

$('.newshop').click(function (ev) {//.exchangId
    var ev = ev || window.event;
    var target = ev.target || ev.srcElement;
    if (target.nodeName.toLowerCase() == 'p') {
        if ($(target).parent('dd').hasClass('exchangId'))   {
            var add = $(target);
            ......
         }
     }
});
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

友情链接更多精彩内容