jQuery UI 1.8rc3 - Button events on a checkbox

jQuery UI 1.8rc3 - Button events on a checkbox

Also mentioned here:

If you turn a checkbox into a button, IE7 and IE8 will ignore any events. Events work fine under FF, Chrome, and Safari.

The following code is an example. The button event will not work in IE7/8. .change() has the same results as .click().

  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
  5. <script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/minified/jquery-ui.min.js" type="text/javascript"></script> 
  6. <link rel="stylesheet" href="http://jquery-ui.googlecode.com/svn/tags/latest/themes/base/jquery-ui.css" type="text/css" media="all" /> 
  7. <script type="text/javascript">
  8. $(function() {
  9. $("#checkbox-button").button();
  10. $(":checkbox").click(function(e){alert("Click!");});
  11. });
  12. </script>

  14. </head>
  15. <body>
  16. <input type="checkbox" id="checkbox-button"/><label for="checkbox-button">A checkbox turned into a button</label><br />
  17. <input type="checkbox" id="checkbox"/><label for="checkbox">A checkbox</label><br />
  18. </body>
  19. </html>