资讯专栏INFORMATION COLUMN

js基础之事件绑定

nidaye / 1402人阅读

摘要:所以还是有空就回顾回顾基础的知识,今天,就来看看事件绑定的问题吧。在一个点击事件内部嵌套点击事件,外点击事件执行几次,就会给内部的事件冤元素绑定几次点击事件,因此使用不当就会造成内部事件多次执行的问题。

js基础

1.写的代码越多,按理说基础应该是更加扎实,但是最近不知道怎么回事,总是犯不该犯的错误。所以还是有空就回顾回顾基础的知识,今天,就来看看js事件绑定的问题吧。
2.绑定事件的嵌套问题,是最容易出错的。
3.在一个点击事件内部嵌套点击事件,外点击事件执行几次,就会给内部的事件冤元素绑定几次点击事件,因此使用不当就会造成内部事件多次执行的问题。不说了,上代码。

$("div.div1").click(function() {
    alert("123");
    fon()
})

function fon() {
    $("div.div2").click(function() {
        alert("456");
    })
}

以上的写法会造成点击div1多少次,就会在第一次点击div2的时候弹出多少遍456,因此,为避免这种错误,正确的做法是在绑定点击事件之前先解绑事件,看代码。

$("div.div1").click(function() {
    alert("123");
    fon()
})

function fon() {
    $("div.div2").unbind("click")
    $("div.div2").click(function() {
        alert("456");
    })
}

当然,这种做法运行代码是没什么问题的,不过不建议这种写法,最好的最优的写法不应该是嵌套事件,就乖乖地编程不好吗???

$("div.div1").click(function() {
    alert("123");
})
$("div.div2").click(function() {
    alert("456");
})

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/107274.html

相关文章

  • 原生jsDOM事件相关

    摘要:而由于级标准中并没有定义事件相关的内容,所以事件级别只包括级,级和级三种。此属性返回当前事件所绑定的对象。自定义事件可以绑定到任意元素上,此处选择只是为了演示方便。 前端学习的东西有很多,现代前端开发,前端工程化的东西要懂,基础的原生js也要懂,毕竟,框架都是有生命周期的,更替非常快,然而却有这么一个框架,它是最轻量的前端框架,每个浏览器都内置,它叫vanilla.js。好吧,其实va...

    learning 评论0 收藏0
  • Vue基础内部指令(下)

    摘要:绑定事件监听器直接撸代码计数器是实例的挂在对象等同于,是的语法糖,在内定义好方法,指令监听事件来触发一些代码。 v-on绑定事件监听器 直接撸代码: 计数器 number:{{number}} + - var app = new Vue({ el: #app, // app是Vue实例的挂在对象 data: { ...

    maybe_009 评论0 收藏0
  • Vue基础内部指令(下)

    摘要:绑定事件监听器直接撸代码计数器是实例的挂在对象等同于,是的语法糖,在内定义好方法,指令监听事件来触发一些代码。 v-on绑定事件监听器 直接撸代码: 计数器 number:{{number}} + - var app = new Vue({ el: #app, // app是Vue实例的挂在对象 data: { ...

    2bdenny 评论0 收藏0
  • Vue基础内部指令(下)

    摘要:绑定事件监听器直接撸代码计数器是实例的挂在对象等同于,是的语法糖,在内定义好方法,指令监听事件来触发一些代码。 v-on绑定事件监听器 直接撸代码: 计数器 number:{{number}} + - var app = new Vue({ el: #app, // app是Vue实例的挂在对象 data: { ...

    LMou 评论0 收藏0

发表评论

0条评论

nidaye

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<