Reputation: 146302
I am creating a popup as follows:
var comet = {
popup: null,
newPopup: function(windowsname, w, h){
this.popup = window.open(windowsname, windowsname, 'width=' + w + ',height=' + h);
var self = comet;
var logOut= null;
$(this.popup.document).ready(function(){
logOut = self.popup.document.getElementById('logout');
console.log(logOut);
$(logOut).live('click', function(){
alert('HELLO');
return false;
})
})
},
some_function: function(){
//calling it here:
this.newPopup('index.php',1120,550);
}
}
The logOut
sometimes (usually on the 1st window open) returns null. Also, the click handler never goes through and the original click handler operates.
How do I overwrite the real click handler of the popup?
Both pages are on my site, so there should be no cross site issues..
Here is a fiddle that shows a little of what I am trying to do: http://jsfiddle.net/maniator/K2B3q/
Upvotes: 4
Views: 8271
Reputation: 359776
Tested and working in Firefox 4 and Chrome 11. Check it out.
$(function()
{
var comet =
{
popup: null,
newPopup: function(url, w, h)
{
this.popup = window.open(url, url, 'width=' + w + ',height=' + h);
var self = this;
this.popup.onload = function ()
{
var doc = this.document,
script = doc.createElement('script');
script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js';
script.onload = function ()
{
function setup()
{
$('#logout').click(function () { alert('It worked!'); });
}
script = doc.createElement('script');
script.textContent = "(" + setup.toString() + ")();";
doc.body.appendChild(script);
};
doc.head.appendChild(script);
};
},
foo: function()
{
this.newPopup('http://jsbin.com/amuza3/2', 600, 400);
}
};
$('#clickme').click(function ()
{
comet.foo();
});
});
Upvotes: 1