抓取用户输入答案

【问题标题】：Grabbing User Input抓取用户输入
【发布时间】：2012-06-02 16:06:35
【问题描述】：

First name: <input type="text" name="firstname"></input>
<input type="submit" value="Submit" />

假设我有上面的简单表格。我将如何获取用户在 JS 的名字字段中输入的内容。我试过了：

document.getElementsByTagName("input")[1].onclick = function() {
    inputted = document.getElementsByTagName("input")[0].innerHTML;
}

但这不起作用。我该怎么做？

【问题讨论】：

标签： javascript html forms input

【解决方案1】：

使用value 进行文本输入：

 inputted = document.getElementsByTagName("input")[0].value;

还要确保将 var 关键字添加到您的变量中，这样您就不会创建全局变量：

var inputted = document.getElementsByTagName("input")[0].value;

你也不应该把关闭</input>标签，因为它是自关闭标签：

<input type="text" name="firstname" />

顺便说一句，您还可以使用以下语法获取元素值：

formName.elementName.value;

或者

document.forms['formName'].elementName.value;

在你的情况下是：

var inputted = formName.firstname.value;

或者

var inputted = document.forms['formName'].firstname.value;

将formName 替换为您的<form> 元素的任何名称。

最后你还可以得到元素的value，如果你对它应用id：

<input type="text" name="firstname" id="firstname" />

然后使用getElementById:

var inputted = document.getElementById('firstname');

【讨论】：

【解决方案2】：

 var inputs=document.getElementsByTagName("input"),
      i=inputs.length;
 //
    while(i--){
               inputs[i].onclick=myClickEventHandler;
     };
//
 function myClickEventHandler(evt){
    var myVal;
     switch (this.name) {

        case 'firstname':

             myVal = this.value;
            break;
    };
 };

【讨论】：

【解决方案3】：

如果您使用的是表单，则可以尝试这样的方法：

var input = document.forms["formName"]["fieldName"].value;

否则，使用.value 属性：

var input = document.getElementsByTagName("input")[0].value;

【讨论】：