Skip to main content

Bug Tracker

Side navigation

#739 closed bug (invalid)

Opened December 25, 2006 04:27PM UTC

Closed March 24, 2007 03:45AM UTC

Last modified June 21, 2007 04:32AM UTC

problem with all event binding functions in jquery 1.04 when used in iframe to bind event to parent frame (IE 7)

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

test.htm

<!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.1EN" "http:www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>

<title>Test</title>

</head>

<body>

<div class='pak2' id="pak1">

test

</div>

<iframe src="jq.htm"></iframe>

</body>

</html>

jq.htm

<script src="jquery.js" type="text/javascript"></script>

<script>

$(parent.document.body).find(".pak2").fadeTo(200,0.1);

parent.document.getElementById("pak1").onmouseover=function(){alert('pak1')};

$(parent.document.body).find(".pak2").mouseover(function(){alert("this will not pop up.. ")})

</script>

Expected

As per Firefox 2.01: 2 alert messages

Behaviour in IE 7

Nothing happens.

If you remove the last line (the line that uses the $().mouseover()), the first alert happens.

Notes

This problem exists with other similar jquery event functions like hover, etc.

Side note/Possible bug

Changing the expression in find() from ".pak2" to "#pak1" does not return you the same behaviour as using ".pak2"

Attachments (0)
Change History (5)

Changed January 04, 2007 07:33PM UTC by aaron.heimli comment:1

Loading jQuery from test.htm seems to solve the problem...weird...

test.htm

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <title>Test</title>
    <script src="jquery.js" type="text/javascript"></script>
</head>
<body>
    <div class="pak2" id="pak1">test</div>
    <iframe src="jq.htm"></iframe>
</body>
</html>

jq.htm

<script>
    parent.$(parent.document.body).find(".pak2").fadeTo(200,0.5);
    
    parent.document.getElementById("pak1").onclick = function() {
        alert('pak1');
    };
    
    parent.$(parent.document.body).find(".pak2").click(function() {
        alert("this will not pop up.. ");
    });
</script>

Changed January 11, 2007 07:34AM UTC by john comment:2

resolution: → invalid
status: newclosed

Changed January 13, 2007 03:46AM UTC by anonymous comment:3

resolution: invalid
status: closedreopened

How is this bug invalid? I just tested it and the problem still exists in jquery 1.1b..

Is it invalid because if you include the jquery library in the parent frame AND then call the parent frame's jquery function, i.e.

parent.$(parent.document.body)

the problem will go away? I hardly see that as being a proper resolution as perhaps the reason why the functionality isn't done in the parent frame directly is because for whatever reason the parent frame cannot include the jquery file.. such as it using other libaries that too overload the $() operator for example, and hence has delegated jquery functionalities to an iframe with its own javascript instance.

Changed January 31, 2007 05:17PM UTC by brandon comment:4

Putting jQuery in an IFrame just to avoid $ conflicts would cause a lot of extra trouble that isn't needed.

Just call jQuery.noConflict() after including jQuery and then you can reassign the jQuery alias to whatever you want.

jQuery.noConflict();

var $j = jQuery;

Now use $j instead of $ for jQuery methods.

Changed March 24, 2007 03:45AM UTC by john comment:5

resolution: → invalid
status: reopenedclosed

Since there's been no follow-up, it appears as if Brandon's recommended solution is adequate. Closing the ticket.