Могу ли я иметь два события jquery 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, пожалуйста.

Ответ 1

Вы можете иметь несколько событий (похожих), связанных с одним и тем же элементом. Но если вы связываете события с помощью inline-обработчика событий, вы можете сделать одно событие определенным.

ПРИМЕЧАНИЕ. Всегда лучше использовать привязку событий с помощью 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
});

Проверить скрипт

Ответ 2

Попробуйте заменить "return false"; с "event.preventDefault();". Это должно позволить событию распространяться, поэтому обработчик кликов запускает, но все равно останавливает a-href от навигации.

Ответ 3

Обычно считается неправильной практикой использования атрибута onclick. Он смешивает слишком много структуры (HTML) с поведением (JavaScript).

Почему бы не сделать все это вместе?

<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>