sainture
6/8/2016 - 3:00 PM

Events - Event handlers

Events - Event handlers

// onload
// onclick
// onmouseover
// onblur
// onfocus

/* method 1 
<button  onclick="alert('hello')"></button>
*/

/* method 2 

note that if you try to attach a click event in the JS file before DOM ready, 
it may not work because at the time of attaching the event, the element might not 
be available.
so its a good practice to place your event binding methods inside window.onload
to make sure the DOM is ready

*/
myelement.onclick = function() {
  // your code here  
  
};

window.onload = function() {
};


/* method 3 

advantage: you can add multiple listeners & remove any of it
disadv: IE8 and below doesn't support this, IE8 uses attachEvent method

jQuery automatically deals with these cross browser issues

*/

document.addEventListener('click', myFunction, false);
document.addEventListener('click', anotherFunction, false);

document.removeEventListener('click', anotherFunction, false);