Modifying onclick event at runtime, problem.
-
I have two web pages. The main page contains several VML rectangles that have their "onclick" events set to javascript code. The second page is opened by the first page when a particular link is clicked. What I want to do is change the onclick event of a element on the main page from the 2nd page. So far I am able to retrieve the reference to the object and view it's initial onclick event:
// this code is in the 2nd page that was opened by the main page var rectelem = window.opener.document.getElementById('event2_2372'); alert(rectelem.onclick); // this works and shows me what it is initially set to. rectelem.onclick = 'alert(\'This is the new onclick event!\');' ; alert(rectelem.onclick); // shows that the change was made.When I switch back to the main page and click on the object though, the initial onclick behavior is gone but the new behavior does not take place. Nothing happens and I get no script error to look at. I've tried moving the new onclick behavior to a function and then setting the object's onclick to the address of that function:rectelem.onclick = test; function test() { alert('This is the test function!'); }This approach has had the same result so far :( Any ideas on what I'm doing wrong or how to change this events behavior at runtime? -
I have two web pages. The main page contains several VML rectangles that have their "onclick" events set to javascript code. The second page is opened by the first page when a particular link is clicked. What I want to do is change the onclick event of a element on the main page from the 2nd page. So far I am able to retrieve the reference to the object and view it's initial onclick event:
// this code is in the 2nd page that was opened by the main page var rectelem = window.opener.document.getElementById('event2_2372'); alert(rectelem.onclick); // this works and shows me what it is initially set to. rectelem.onclick = 'alert(\'This is the new onclick event!\');' ; alert(rectelem.onclick); // shows that the change was made.When I switch back to the main page and click on the object though, the initial onclick behavior is gone but the new behavior does not take place. Nothing happens and I get no script error to look at. I've tried moving the new onclick behavior to a function and then setting the object's onclick to the address of that function:rectelem.onclick = test; function test() { alert('This is the test function!'); }This approach has had the same result so far :( Any ideas on what I'm doing wrong or how to change this events behavior at runtime?I have since been able to get the second approach to work by putting the function test() on the main page and then setting the onclick event = to window.opener.test. This still leaves me with the underlying problem though which is that I need to change what test() does during runtime which I'm not sure how to do.
-
I have since been able to get the second approach to work by putting the function test() on the main page and then setting the onclick event = to window.opener.test. This still leaves me with the underlying problem though which is that I need to change what test() does during runtime which I'm not sure how to do.
-
Try to put the function object in the event instead of in the page:
rectelem.removed = function() { alert('This is the test function!'); }--- b { font-weight: normal; }
-
I have two web pages. The main page contains several VML rectangles that have their "onclick" events set to javascript code. The second page is opened by the first page when a particular link is clicked. What I want to do is change the onclick event of a element on the main page from the 2nd page. So far I am able to retrieve the reference to the object and view it's initial onclick event:
// this code is in the 2nd page that was opened by the main page var rectelem = window.opener.document.getElementById('event2_2372'); alert(rectelem.onclick); // this works and shows me what it is initially set to. rectelem.onclick = 'alert(\'This is the new onclick event!\');' ; alert(rectelem.onclick); // shows that the change was made.When I switch back to the main page and click on the object though, the initial onclick behavior is gone but the new behavior does not take place. Nothing happens and I get no script error to look at. I've tried moving the new onclick behavior to a function and then setting the object's onclick to the address of that function:rectelem.onclick = test; function test() { alert('This is the test function!'); }This approach has had the same result so far :( Any ideas on what I'm doing wrong or how to change this events behavior at runtime?I came up with the following solution: On the main page I have a function that takes a string and then executes that string as code using the eval function:
function execCode(codestring) { eval(codestring); }Then on the popup page I do the following to change the onclick event's code:window.opener.execCode("window.document.getElementById('event2_2372').onclick = function() { alert('Modified event code!'); };");This allows the "function()" assignment to take place in the address space of the main page thus giving it a valid entry point to the function. If anyone has any tweaks or a better way to do this, please let me know. Thanks! -
This only works if that element is on the same page as the function. My element and function that I want to be used for the element's onclick event, reside on the main page but I need to modify that function's code from the popup page.