如何从JavaScript访问HTML文本框?

时间:2021-01-05 14:01:19

How to access an HTML textbox by a javascript function?

如何通过javascript函数访问HTML文本框?

5 个解决方案

#1


9  

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

在文本框中设置ID属性并使用document.getElementById()函数...示例如下:

<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>

#2


6  

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.

变量textboxValue将等于您在文本框中输入的内容。

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.

请记住,在文本框(输入字段)出现在HTML中之后,您必须放置脚本(如果写得那么简单),否则当页面首次加载时您会收到错误,因为脚本正在寻找没有输入字段的输入字段尚未由浏览器创建。

I hope this helps!

我希望这有帮助!

#3


5  

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

为文本框指定一个id属性,然后使用document.getElementById(' ')获取它。

#4


5  

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

首先,您需要能够获得对文本框的DOM(文档对象模型)引用:

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

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

注意id属性,文本框现在有id mytextbox。

Next step is to get the reference in JavaScript:

下一步是在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.

这将通过其id属性检索HTML元素。请注意,这些ID必须是唯一的,因此您不能拥有两个具有相同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!

value属性包含文本框的内容,就是这样!

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

有关更多参考,您可能需要在MDC上查看一些内容:GetElementByID参考输入元素参考DOM的一般概述

#5


4  

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

document.getElementById('textboxid')。value或document.formname.textboxname.value

#1


9  

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

在文本框中设置ID属性并使用document.getElementById()函数...示例如下:

<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>

#2


6  

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.

变量textboxValue将等于您在文本框中输入的内容。

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.

请记住,在文本框(输入字段)出现在HTML中之后,您必须放置脚本(如果写得那么简单),否则当页面首次加载时您会收到错误,因为脚本正在寻找没有输入字段的输入字段尚未由浏览器创建。

I hope this helps!

我希望这有帮助!

#3


5  

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

为文本框指定一个id属性,然后使用document.getElementById(' ')获取它。

#4


5  

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

首先,您需要能够获得对文本框的DOM(文档对象模型)引用:

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

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

注意id属性,文本框现在有id mytextbox。

Next step is to get the reference in JavaScript:

下一步是在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.

这将通过其id属性检索HTML元素。请注意,这些ID必须是唯一的,因此您不能拥有两个具有相同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!

value属性包含文本框的内容,就是这样!

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

有关更多参考,您可能需要在MDC上查看一些内容:GetElementByID参考输入元素参考DOM的一般概述

#5


4  

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

document.getElementById('textboxid')。value或document.formname.textboxname.value