2个不同的点击事件冲突？

Question

我有一个链接:

<a href="javascript:void(0)" class="lorem hello"> link </a>

我有两个不同的onclick函数设置为这两个类:

jQuery(".lorem").each(function(){
    this.onclick = function() {

        // stuff

    }
});

和

jQuery(".hello").each(function(){
    this.onclick = function() {

        // stuff

    }
});

这会阻止顶部工作.为什么？如何让这两个功能在分离时工作？

Answer 1

您只能为onclick属性分配一个函数.你应该使用普通的jQuery事件绑定,它允许多个处理程序:

$(".lorem").click(function() {
    // stuff
});
$(".hello").click(function() {
    // stuff
});

如果你想用原生Javascript做,你可以使用addEventListener; 顾名思义,这些是添加剂,它们不会取代.

jQuery(".lorem").each(function(){
    this.addEventListener("click", function() {

        // stuff

    })
});
jQuery(".hello").each(function(){
    this.addEventListener("click", function() {

        // stuff

    })
});

Answer 2

当您使用查询时,为什么要使用.onclickDOM元素(因此覆盖以前的绑定).而是使用jQuery .on:

$('.lorem').on('click', function(){
  // something
});
$('.hello').on('click', function(){
  // something else
});