我可以在一個元素中有兩個jQuery的onclick事件嗎？

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 
}); 

香草的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

嘗試替換「返回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>