Как вы поймаете событие click с простым Javascript?

Ответ 1

document.getElementById('element').onclick = function(e){
  alert('click');
}

DEMO: http://jsfiddle.net/e9jZW/1/

Ответ 2

Добавляя прослушиватель событий или устанавливая обработчик onclick:

var el = document.getElementById("myelement");

el.addEventListener('click', function() {
  alert("Clicked");
});

// ... or ...

el.onclick = function() {
  alert("Clicked");
}

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

Если вам нужно добавить эти обработчики к нескольким элементам, вы должны приобрести их по мере необходимости и добавить их к каждому отдельно.

Ответ 3

Я бы рекомендовал перейти с addEventListener вместо назначения функции обработчика напрямую.

var div = document.getElementById('test');
div.addEventListener('click', function(){ 
    console.log('CLICKED');
});

Есть несколько причин для этого, я назову те, которые я нахожу наиболее важными:

• Вы не можете ошибочно добавить прослушиватель событий к объекту, отличному от DOM, с помощью addEventListener - ваш код потерпит неудачу вместо того, чтобы спокойно назначить функцию onclick для какого-либо объекта
• Вы можете прикрепить только один (без дополнительной обработки кода для каждого обработчика, который вы хотите добавить), прослушиватель событий с onclick - то, что может оказаться ограничивающим

Ответ 4

Я создаю своего рода глобальный обработчик событий, очень мощный, вы можете захватить className, события типа "types" nodeTypes, назовите его, я надеюсь, что люди найдут этот useul

 document.onclick = eventRef


 function eventRef(evt) {
var han;
evt || (evt = window.event)

  if (evt) {



  var elem = evt.target ? han = evt.target : evt.srcElement && (han = evt.srcElement)

     // evt.type could be, mouseup, mousedown...
     // elem.id is the id or the element
     // elem.className is the class name of the element
     // you could nest expression, use substrings to extract part of a className



       if (evt.type=="click" && elem.id == "gotit" || elem.className == "someClassName") {  
       alert(elem.id)

      }
}
}

Ответ 5

Вот интересная статья об этом, я использовал один и тот же подход несколько раз, в основном, вы добавляете обработчик событий в window. http://mislav.uniqpath.com/js/handling-events-on-elements/