How to access an HTML textbox from javascript?_问答_开发者

How to access an HTML textbox from javascript?

开发者 https://www.devze.com 2023-01-25 12:30 出处：网络

How to access an HTML textbox by a javascript fun开发者_StackOverflow中文版ction?Set ID property on text box and use document.getElementById() function... Example below:

How to access an HTML textbox by a javascript fun开发者_StackOverflow中文版ction?

Set ID property on text box and use document.getElementById() function... Example below:

<html>
<head>
<script type="text/javascript">

function doSomethingWithTextBox()
{
  var textBox = document.getElementById('TEXTBOX_ID');
  // do something with it ...

}

</script>
</head>

<body>

<input type="text" id="TEXTBOX_ID">

</body>
</html>

First you need to be able to get a DOM(Document Object Model) reference to the textbox:

<input type="text" id="mytextbox" value="Hello World!" />

Notice the id attribute, the textbox now has the id mytextbox.

Next step is to get the reference in JavaScript:

var textbox = document.getElementById('mytextbox'); // assign the DOM element reference to the variable "textbox"

This will retrieve a HTML Element by its id attribute. Note that those id's need to be unique, so you can't have two textboxes with the same id.

Now the final step is to retrieve the value of the textbox:

alert(textbox.value); // alert the contents of the textbox to the user

The value property contains the contents of the textbox, and that's it!

For more reference you might want to check out some stuff over at MDC:
GetElementByID Reference
Input Element Reference
A general overview of the DOM

Very simply, try this:

<!doctype html>
<html>
    <head>
        …
    </head>
<body>
    <form>
        <input id="textbox" type="text" />
    </form>
    <script>
        var textboxValue = document.getElementById("textbox").value;
    </script>
</body>

The variable textboxValue would equal whatever you've typed into the textbox.

Remember you must place your script, if written as simply as this, after the textbox (input field) appears in your HTML, otherwise when the page first loads you'd get an error, because the script is looking for input field that has not yet been created by the browser.

I hope this helps!

Give your textbox an id attribute, and after, fetch it with document.getElementById('<textbox id>').

document.getElementById('textboxid').value or document.formname.textboxname.value