Sign in to follow this  

[web] Using the input tag with javascript.

This topic is 4854 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

I'm trying to make it so that when you hover over one of my links a description of it will appear in a text field. I tried to do it like this: this is in the heading:
<script language="javascript">
mystring='';
function display(){
mystring='You Suck';
}
</script>

this is on the link:
<a href = "dragonball.html"class="nav" onMouseOver="display()"><strong>&#187</strong>Dragon Ball</a>

and this is my text field:
<script language="javascript">
<input type="text" value=mystring name="input1"></input>
</script>

Keep in mind i'm not really experienced with programming javascript. It's probably something in the syntax but i thought that when there is an error in javascript code it says it where it would normally say done. So it must be in my html code. Help is very appreciated. Thanks in advance.

Share this post


Link to post
Share on other sites
There are several things wrong with this.

An input element declaration, is not javascript code, and should not be put inside <script> tags.

Input elements should probably be put inside a form (even if the form is never submit).

This means if you need to change the contents of the input, you can do:


function display() {
var myInput = document.forms[0].input1;
myInput.value = "You suck";
}



Which should work, and uses only the so-called "DOM0" DOM functions, which work on practically any browser that has javascript support.

You will need to give the input a name.

Alternatively, you can give the input object and ID instead, and use document.getElementById() to find it. This is a "DOM1" method, but still supported by most browsers.

This method also alleviates the need to put the input inside a form.

Mark

Share this post


Link to post
Share on other sites
so would i do in the header:
<script language="javascript">
function giveDes(){
var myInput = document.getElementById(1);
myInput = "You suck!";
}
then down in the body:
<input type="text" id="1" value="" onMouseOver="giveDes()"></input>
Is that the way i should do it?

Share this post


Link to post
Share on other sites
Instead of giving the element a numeric ID, give it a string ID as it could cause problems later on for the js interpreter.


This should work...


<script language="javascript">
function giveDes(){
var myInput = document.getElementById("myID");
myInput.value = "You suck!";
}

<input type="text" id="myID" value="" onMouseOver="giveDes()"></input>



What you're doing is getting a named element from the DOM, then asisgning a value to it's .value member attribute. If you're unsure, check the Forum FAQ for some links and tutorials on javascript.

Share this post


Link to post
Share on other sites
Quote:
Original post by evolutional
Instead of giving the element a numeric ID, give it a string ID as it could cause problems later on for the js interpreter.


No it couldn't.

If you understand javascript, you will realise how straightforward it is.

But I'd agree, using a name would make the code more maintable.

Mark

Share this post


Link to post
Share on other sites
You can also reference elements by offset, not with the getElementById function, but when you're accessing collections/arrays and such. I'd generally steer away from numeric id names because it'd lead to confusing code in the long run.

Share this post


Link to post
Share on other sites

This topic is 4854 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this