gauravc7 Posted July 28, 2009 Share Posted July 28, 2009 hi,i am very new to js & finding some problems in executing some things. my page code goes like this///////////////////////////////////////////////////////////////////////////////////////////////////////<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>my global variable</title><script type="text/javascript"> var k=document.miform.txt1; function f1() { alert(k.value); } </script> </head><body><form name="miform" action=""><input type="text" name="txt1" id="AA" /><input type="button" onclick="f1()" value="Click Me" /></form></body></html>///////////////////////////////////////////////////////////////////////////////////////////////////////////////////but if i write k=document.miform.txt1.value;inside the function f1() then this works well. i am not able to understand the one thing that when k is global & i have stored tx1 in k then i why i am not able to use it in entire js document.if i need to do any thing with this object k i can do it once i have the element inside kelse i will be required to write k=doc........ again & again in each function. Link to comment Share on other sites More sharing options...
dsonesuk Posted July 28, 2009 Share Posted July 28, 2009 outside the function, the var k=document.miform.txt1; looks for the input value before it has been created, so no value, and not even the input will be found.inside the function, the var k=document.miform.txt1; input value can now be found, obviously because the submit button is clicked therefore the input value is retrieved and the alert given.you could place var k=document.miform.txt1; at the bottom of the page.or use below code:var k;function getthisvalue(){k=document.miform.txt1;return k;}function f1() {k=getthisvalue();alert(k.value);} Link to comment Share on other sites More sharing options...
justsomeguy Posted July 28, 2009 Share Posted July 28, 2009 To clarify a little more, when you have inline code like that it runs the code as soon as it gets to it. So, it's going to run the code as soon as it gets to the <head> section, before it has created anything in the <body> section. So the element you're trying to change doesn't exist yet. Any Javascript code that needs to modify things on the page needs to be set to run after the page loads, you can use the body's onload event for that. It's also a better practice to refer to your elements using getElementById instead of trying to access them by name. e.g.: <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>my global variable</title><script type="text/javascript">function f1() { var k=document.getElementById("AA"); alert(k.value);}</script> </head><body onload="f1()"><form name="miform" action=""><input type="text" name="txt1" id="AA" value="txt1" /><input type="button" onclick="f1()" value="Click Me" /></form></body></html> If you don't want to use onload, like dsonesuk said as long as your script block appears in the code after the element it's trying to modify it will still work. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.