Skip to main content

Bug Tracker

Side navigation

#939 closed bug (fixed)

Opened February 09, 2007 01:06PM UTC

Closed April 22, 2007 03:23AM UTC

Last modified March 15, 2012 06:54PM UTC

events don't work with iframes

Reported by: Volker Mische Owned by:
Priority: major Milestone: 1.1.3
Component: event Version: 1.1a
Keywords: Cc:
Blocked by: Blocking:
Description

If you want to add an event to an iframe it doesn't get fired. I tested it with Iceweasel 2.0.0.1. Here is a minimal example of the problem:

<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <title>event bug</title>
    <script type="text/javascript" src="../jquery-1.1.1.js"></script>
    <script type="text/javascript">
function edit()
{
    var iframe = document.getElementById('myiframe');
    var doc = iframe.contentDocument;
    doc.designMode="on";

    // works in iceweasel 2.0.0.1
    doc.addEventListener('click',function(){alert("addEventListener");},false);
    // doesn't work
    $(doc).bind('click',function(){alert("bind");},false);
}
    </script>
  </head>
  <body onload="edit()">
    <iframe id="myiframe"></iframe>
  </body>
</html>

There's a problem with the event handling code. Please take a look at Dean Edwards' current add event code and his blog entry: he has added support for DOM 2 event handling. With this addition it works. Here's a patch against rev1312 (the patch isn't perfect as i don't know much about jquery's eventhandling but it should serve as a starting point)

Index: event.js
===================================================================
--- event.js	(revision 1312)
+++ event.js	(working copy)
@@ -17,32 +17,36 @@
 		if( data ) 
 			handler.data = data;
 
-		// Make sure that the function being executed has a unique ID
-		if ( !handler.guid )
-			handler.guid = this.guid++;
+		if (element.addEventListener) {
+			element.addEventListener(type, handler, false);
+                } else {
+			// Make sure that the function being executed has a unique ID
+			if ( !handler.guid )
+				handler.guid = this.guid++;
 
-		// Init the element's event structure
-		if (!element.events)
-			element.events = {};
+			// Init the element's event structure
+			if (!element.events)
+				element.events = {};
 
-		// Get the current list of functions bound to this event
-		var handlers = element.events[type];
+			// Get the current list of functions bound to this event
+			var handlers = element.events[type];
 
-		// If it hasn't been initialized yet
-		if (!handlers) {
-			// Init the event handler queue
-			handlers = element.events[type] = {};
+			// If it hasn't been initialized yet
+			if (!handlers) {
+				// Init the event handler queue
+				handlers = element.events[type] = {};
 
-			// Remember an existing handler, if it's already there
-			if (element["on" + type])
-				handlers[0] = element["on" + type];
-		}
+				// Remember an existing handler, if it's already there
+				if (element["on" + type])
+					handlers[0] = element["on" + type];
+			}
 
-		// Add the function to the element's handler list
-		handlers[handler.guid] = handler;
+			// Add the function to the element's handler list
+			handlers[handler.guid] = handler;
 
-		// And bind the global event handler to the element
-		element["on" + type] = this.handle;
+			// And bind the global event handler to the element
+			element["on" + type] = this.handle;
+		}
 
 		// Remember the function in a global list (for triggering)
 		if (!this.global[type])
@@ -55,18 +59,22 @@
 
 	// Detach an event or set of events from an element
 	remove: function(element, type, handler) {
-		if (element.events)
-			if ( type && type.type )
-				delete element.events[ type.type ][ type.handler.guid ];
-			else if (type && element.events[type])
-				if ( handler )
-					delete element.events[type][handler.guid];
+		if (element.removeEventListener) {
+			element.removeEventListener(type, handler, false);
+		} else {
+			if (element.events)
+				if ( type && type.type )
+					delete element.events[ type.type ][ type.handler.guid ];
+				else if (type && element.events[type])
+					if ( handler )
+						delete element.events[type][handler.guid];
+					else
+						for ( var i in element.events[type] )
+							delete element.events[type][i];
 				else
-					for ( var i in element.events[type] )
-						delete element.events[type][i];
-			else
-				for ( var j in element.events )
-					this.remove( element, j );
+					for ( var j in element.events )
+						this.remove( element, j );
+		}
 	},
 
 	trigger: function(type, data, element) {
Attachments (0)
Change History (3)

Changed March 24, 2007 05:48PM UTC by john comment:1

need: → Test Case

Changed March 25, 2007 12:01PM UTC by joern comment:2

need: Test CaseCommit

Added test in [1587].

Changed April 22, 2007 03:23AM UTC by brandon comment:3

resolution: → fixed
status: newclosed

This is fixed in Rev. 1765.