关于jquery的事件命名空间

在多人协作的前端开发中,或许会遇到一个问题:几个开发人员都给一个元素添加了同样的事件,但是又有开发人员想要解除掉元素身上的某个事件效果,这时候操作起来就有些麻烦,需要用到jquery给我们提供的事件命名空间。说的有点抽象,举个例子先:

比如有一个开发人员写到下面这样的代码:

$("#box").on('click',function () {
    $(this).css('background','#0f0');
})

还有一个开发人员写成这样:

$("#box").on('click',function () {
    $(this).css('color','#fff');
})

这时候如果第三个开发人员想要去除掉#box点击时文字变色的事件,他会考虑写下面的代码:

$("#box").off('click');

然而,这时你却发现,#box身上的click事件都被解绑了,这当然不是我们想要的,我们想要的是把文字变色的事件解绑,而背景变色的事件保留,这时,就要用上jquery给我们提供的事件命名空间。把上面的代码改写成如下:

$("#box").on('click.backgroud',function () {
    $(this).css('background','#0f0');
});

$("#box").on('click.color',function () {
    $(this).css('color','#fff');
});

$("#box").off('click.color');

这样就可以实现上述的请求,而这里添加的background和click就是事件的命名空间,好玩吧,有趣的jquery等着你去探索!

 

原文地址:https://www.cnblogs.com/lingdublog/p/6495622.html