Question

我知道之前已经问过这个问题，但是我甚至无法在一个onclick中获得如何添加我的特定函数的语法。

当前的onclick代码：

<a class="thumbLinkCart" href="#" onclick="simpleCart.add('name=lemon','price=7.99','image=images/thumbs/yellowgold.jpg');return false;"></a>

要添加的第二个事件：

<script>
    $(document).ready(function() { 
      $('#demo12').click(function() { 
   $.growlUI('Item added to cart'); 
}); 
}); 
</script>

有人可以帮助我将第二个功能添加到第一个onclick事件中。

Answer 1

您可以将多个事件（类似）绑定到同一个元素。但是如果使用内联事件处理程序绑定事件，则最多可以定义一个事件。

注意：使用javascript绑定事件始终是一个更好的主意，因为它保持了关注点的分离和可维护性。

您可以将多个事件绑定到JS代码中的元素，而不是更清晰

<强>的jQuery

 $('#demo12').on('click', function() { 
    alert('1st click event');
    //  Add items to the cart here
});

$('#demo12').on('click', function() { 
    alert('2nd click event');
    //  Do something else
});

Vanilla Javascript

document.querySelector('#demo12').addEventListener('click', function() { 
    alert('1st click event');
    //  Add items to the cart here
});

document.querySelector('#demo12').addEventListener('click', function() { 
    alert('2nd click event');
    //  Do something else
});

<强> Check Fiddle

Answer 2

尝试替换“return false;” “event.preventDefault（）;”。这应该让事件向上传播，以便点击处理程序触发，但仍然停止a-href导航。

Answer 3

使用onclick属性通常被认为是不好的做法。它与行为（JavaScript）混合了太多的结构（HTML）。

为什么不一起做呢？

<a class="thumbLinkCart" href="#">Link</a>

和

<script>
  $(document).ready(function() { 
    $('.thumbLinkCart').click(function() {
      simpleCart.add('name=lemon','price=7.99','image=images/thumbs/yellowgold.jpg'); 
      $.growlUI('Item added to cart'); 
    }); 
  }); 
</script>

我可以在一个元素中有两个jquery onclick事件吗？

3 个答案: