unbind() fails on events not attached by jQuery

Reported by:	rob.desbois	Owned by:
Priority:	minor	Milestone:	1.1.3
Component:	event	Version:	1.1.2
Keywords:	unbind	Cc:
Blocked by:		Blocking:

Description

For events which are specified in the HTML source, unbind() fails to attach them. This behaviour is verified with several event types in Firefox 2.0.0.2 and IE6.0 with the following test page:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
   <meta http-equiv='content-type' content='text/html; charset=ISO-8859-1' />
   <title>Tester</title>
   <script src='/jquery-uncompressed.js' type='text/javascript'></script>
   <script type='text/javascript'><!--
   $(document).ready(function()
   {
      $("#testButton")
         .html("ready to test");
   })
   
   function test()
   {
      $("#testButton").unbind("click").html("Tested already");
   }
   // --></script>
</head>
<body>
   <button id="testButton" onclick="test()">Test me</button>
</body>
</html>

This can be worked around by using removeAttr() instead:

   $("#testButton").removeAttr("onclick").html("Tested already");

Attachments (0)

Change History (4)

Changed March 13, 2007 12:41PM UTC by rob.desbois comment:1

Additionally, removeAttr() does not work on events added through jQuery. Thus, if you want to remove the click event from a button but you aren't sure whether it was attached as an onclick attribute or by the jQuery click(fn) function, you must do:

   $("#testButton").removeAttr("onclick").unbind("click");

Changed March 14, 2007 08:56AM UTC by rob.desbois comment:2

Open the following script in Fx, click Test. So far, so good. Click Reset then test again. Two alerts?! Click reset once more and it's fine again.

If you trace the events in firebug in a correct test run the following happens: onclick() calls Test().

On the second run when it alerts twice, the first call is Test(), called by onclick(), called by handle(), which is a jQuery function, a jQuery function to 'Handle the second event of a trigger'. That's as far as my diagnosis has gone.

Works fine with IE.

<html>
<head>
   <script src='jquery.js' type='text/javascript'></script>
   <script type='text/javascript'>
   function Test()
   {
      alert('tested');
   }
   
   function Reset()
   {
      $("#testButton").unbind("click");
      // shouldn't be required but unbind() doesn't work set in HTML attributes
      $("#testButton").removeAttr("onclick");
      $("#testButton").click(Test);
   }
   </script>
</head>

<body>
   <button id='testButton' type='button' onclick='Test()'>Test</button>
   <button type='button' onclick='Reset()'>Reset</button>
</body>
</html>

Changed April 24, 2007 10:44PM UTC by brandon comment:3

need:	→ Review
resolution:	→ wontfix
status:	new → closed

jQuery will not remove events it did not bind. However I have seen a couple of requests for this. Perhaps it would be best suited as a plugin/extension to jQuery. Maybe called unbindAll().

Changed January 12, 2009 08:37PM UTC by SineSwiper comment:4

If this is going to be marked as wontfix, then I would highly recommend updating the documentation with this discrepancy and point out the removeAttr example. I got caught by this bug/feature, and it took me a while to figure it out.

I would recommend adding this in as part of the code. It just seems oddly inconsistent without it. (I had no idea that jQuery was not using the default triggers for its event actions.)

Side navigation