jQ事件操作

最新推荐文章于 2022-09-20 20:52:15 发布

原创最新推荐文章于 2022-09-20 20:52:15 发布 · 276 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jQuery #事件绑定

前端专栏收录该内容

19 篇文章

订阅专栏

页面上有一个div标签，需要给他绑定很多事件。可以用on来进行绑定。

$('div').on({
                click: function () {
                    console.log('你点我啦');
                },
                mouseenter: function () {
                    console.log('你来啦');
                },
                mouseleave: function () {
                    console.log('你竟然走啦');
                }
            })

可以看见上面的都是做的相同的事，所以我们可以做如下改善：

// 使用on绑定的事件 可以使用事件委托来触发(绑定给老爸,指定他的 儿子后代来触发)
            // 后代元素是动态添加的 也是可以触发
            // 可以把事件绑定给 公共的父元素 指定后代来触发 即可 解决 动态新增的元素没有事件的问题
            $('div').on('click', 'span', function () {
                // console.log('你点我啦');
                console.log(this);
            })

当绑定事件后，在某些情况下，我们不想要这个事件，这时候可以解绑，如下。

 $('input').click(function () {
                // 移除事件
                // 什么都不传 清除所有事件(太暴力)
                // $('div').off();

                // 传入事件名 可以删除指定的事件
                // $('div').off('click');
                $('div').off('click mouseenter');
            })