Что означает привязка события?

Что означает привязка события? Я всегда сталкиваюсь с этим словом всякий раз, когда я ищу в Интернете, и все, что я пытаюсь найти в значении, это все еще неопределенно для меня @_ @ Некоторое время назад, читая некоторые блоги относительно JavaScript, я вижу людей, использующих это святое слово, которое я не могу понять.

ОТВЕТЫ

Ответ 1

Связывание событий означает указание браузеру, что определенная функция должна вызываться всякий раз, когда происходит какое-либо событие. События в основном связаны с пользовательскими вводами, такими как клики.

Пример привязки к событию в jQuery может быть следующим:

$("#elem").bind("click", function() {
    alert("Clicked!");
});

Это связывает функцию с событием click объекта DOM с идентификатором elem. Когда пользователь нажмет на него, появится предупреждение (окно сообщения). Связывание выполняется путем вызова функции jQuery bind, но есть другие способы сделать это (например, функция jQuery click в случае привязки к событию click).

Ответ 2

Когда вы привязываете что-то к событию, оно срабатывает при запуске события. Это как приклеивание тумана к педали тормоза на вашем автомобиле.

Ответ 3

Когда вы выполняете действие на веб-странице, оно вызывает событие. Это может быть что-то вроде:

  • Нажмите кнопку
  • Выберите значение из раскрывающегося списка
  • Наведите указатель мыши на элемент

Эти события могут быть записаны в вашем JavaScript-коде.

Обычным (и часто мигрирующим) способом рассмотрения событий является выполнение этого самого элемента HTML (как показано в атрибуте onclick ниже)

<input id="MyButton" type="button" value="clickme" onlick="Somefunction()" />

Итак, когда пользователь нажимает кнопку, будет выполняться функция SomeFunction.

Однако он считается лучшим подходом к принятию метода, называемого "поздним связыванием". Это гарантирует, что ваш HTML и JavaScript будут полностью разделены.

Итак, мы можем изменить вышеприведенный пример следующим образом:

document.getElementById("MyButton").onclick = function(){
   //functionality here
}

jQuery делает это еще проще:

$("#MyButton").click(function(){
    //functionality here
});