GBS Posted May 4, 2006 Share Posted May 4, 2006 Hi all,,I had a real problem since few days,, about changing mouse attributes dynamically, using javascript,To explain, using a line of code like:[code]document.getElementById('test').setAttribute("onclick","testfunction()";);[/code]just worked fine using Firefox & Opera, but it didn't worked using IE...Trying to understand & solve the problem, I've put in a debug window the onclick attribute content, & result under IE was looking like:[!--quoteo--][div class=\'quotetop\']QUOTE[/div][div class=\'quotemain\'][!--quotec--]function anonymous(){ChangeAttribute(this);}[/quote]& under FF or Opera, it was just like:[!--quoteo--][div class=\'quotetop\']QUOTE[/div][div class=\'quotemain\'][!--quotec--]ChangeAttribute(this);[/quote]So, the problem was about the onclick format function,, which is under IE: function anonymous() {.......}Finally, to dynamically change the onclick attribute, I've used that script which detects if the browser has the keyword 'function' in the onclick attribute or not,, & changes in the correct format the attribute,[code]<html><head><title>changing mouse attributes,</title></head><body><script>function filterLineBreaks (str) {str = str.replace(/\r\n|\r|\n/g, ' ');return str;}function ChangeAttribute(node){// using:// var str=document.getElementById('debug').getAttribute("onclick");// makes a bug with IE, because of the line breaks,// so, we get the onclick attribute using the window debug valuevar str=document.getElementById('debug').value;result = filterLineBreaks(str);//searching for the keyword 'function' in the onclick attributeresult = str.search("function");if (result!=-1) // the keyword 'function' has been found in the onclick attribute, meaning 'the browser is like IE' { //works with IE, but not with Opera or FF: var func="function anonymous() {AttributChanged(this);}"; eval("node.setAttribute(\"onclick\","+func+")"); // BTW, that one didn't work,, don't know why,... : // node.setAttribute("onclick","function anonymous() {AttributChanged(this);}"); }else { //works with FF & Opera but not with IE ! node.setAttribute("onclick","AttributChanged(this);"); }alert('nice shot,,... now we try to change the onclick attribute,,');//works for allnode.value="value changed,... click again to test,,";//debuging the new onclick attributedebug();}function AttributChanged(node){alert('well done,, test finished! :)');node.value="success!";debug();}function debug(){document.getElementById('debug').value=document.getElementById('testing').getAttribute("onclick");}</script><input type="button" id="testing" onclick="ChangeAttribute(this);" value="testing,.... click on me,,"><br><textarea id="debug" cols="100" rows="10"></textarea><script>// debug the current onclick attribute on bodyloaddebug();</script></body></html>[/code]I know,,... I could have done this by:-detect user agent-change the onclick attribute depending of the agent,But I wanted to know also how to remove the break lines in a texarea value,... :)Hoping it will help some,l8tr,, Quote Link to comment https://forums.phpfreaks.com/topic/9057-changing-onclick-attribute-dynamically/ Share on other sites More sharing options...
eemerge Posted June 2, 2006 Share Posted June 2, 2006 just helped one :)had some trouble fixing this on IE/Firefox, to make it work on both of them....of course, the initial code worked fine in FIrefox and Opera...IE sucked as usual...Thanks for the tips...saved me a lot of 'researching' :) Quote Link to comment https://forums.phpfreaks.com/topic/9057-changing-onclick-attribute-dynamically/#findComment-41130 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.