Posted By

coprolit on 03/21/11


Tagged

javascript element event jquery handler unobtrusive single multiple behavior


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

jillella


unobtrusive multiple event handlers on single element using jQuery


 / Published in: JavaScript
 

URL: http://api.jquery.com/bind

  1. /*
  2. Example of inline event handlers:
  3. <input type="text" name="date" onchange="validateDate()" />
  4.  
  5. This is bad.
  6. The purpose of markup is to describe a document's structure, not its programmatic behavior. And what if we need to set handlers for several events on a single element?
  7. */
  8.  
  9. // The unobtrusive solution:
  10.  
  11. <input type="text" name="date" id="date" />
  12.  
  13. /*
  14. A script that runs when page is loaded into the browser, looks for relevant element(s) and set them up accordingly: (using jquery)
  15. */
  16.  
  17. var message = "mouse entered or left.";
  18.  
  19. // passing the variable in by value through eventData:
  20. $('#date').bind('mouseenter mouseleave', {msg: message}, function(event) {
  21. alert(event.data.msg);
  22. });

Report this snippet  

You need to login to post a comment.