美文网首页
label上的事件执行两次问题

label上的事件执行两次问题

作者: 爱笑的疯小妞 | 来源:发表于2018-05-24 16:38 被阅读0次
    <label><input type="checkbox"><span>标签一</span></label>

点击lable会执行两次
产生原因:
span的click,事件冒泡,触发label的click;
label和input关联,触发input的click,事件冒泡,触发lable的click;

解决办法:

    $("label").click(function(){
        console.log("label");
    }) ;
    $("label>span").click(function(){
        console.log("span");
        return false;//阻止冒泡
    });
    $("label>input[type='checkbox']").change(function(){
        console.log("checkbox");
    });

相关文章

网友评论

      本文标题:label上的事件执行两次问题

      本文链接:https://www.haomeiwen.com/subject/lkmsjftx.html