将HTML表单输入转换为JavaScript变量 [英] Turn HTML Form Input into JavaScript Variable
问题描述
我对HTML表单很陌生，我想知道如何轻松（或不）将其输入更改为JavaScript变量。这是我的代码：
I am new to HTML forms and I was wondering how I can easily (or not) change it's input to a JavaScript variable. Here is my code:
<head>
<title>Begin</title>
<link type="text/css" rel="stylesheet" href="begin.css"/>
</head>
<body>
<form action="begin-create-done.html" method="get">
First Name: <input type="text" name="firstname">
<br>
Last Name: <input type="text" name="lastname">
<br>
<br>
New Username: <input type="text" name="user">
<br>
Password: <input type="password" name="pass">
<br>
Repeat Password: <input type="password" name="rpass">
<input type="submit" value="Submit">
</form>
</body>
</html>
我希望表格的每个部分（例如名字，姓氏，新用户名等）是它自己的JavaScript变量。
I want each part of the form (e.x. First Name, Last Name, New Username, etc.) to be it's own JavaScript variable. Thank you very much!
推荐答案
使用JavaScript访问HTML输入元素
Accessing HTML input elements from JavaScript
假设您没有其他名称相同的元素，您可以按照以下名称从JavaScript访问输入值：
Assuming you don't have other elements with same names, you can access input values from JavaScript by name as follows:
var firstName = document.getElementsByName("firstname")[0].value;
您现在拥有名为firstName的JavaScript变量中firstname字段的值。只要不断重复，你也可以得到其他输入字段。然后，可以继续处理这些语句并将其包装到函数中，并在输入数据更改时调用它。例如：
You now have the value from firstname field in JavaScript variable called firstName. Just keep repeating and you got the other input fields too. You can then proceed and wrap these statements to a function and call it when input data changes. For example:
function formChanged() {
var firstName = ...
var lastName = ...
}
现在注册此函数调用来更改/ keyup事件，并且您拥有函数，监视变化的表单值：
Now register this function call to change / keyup events and you have a function that monitors changing form values:
<input type="text" name="firstname" onkeyup="formChanged()" onchange="formChanged()"/>
这篇关于将HTML表单输入转换为JavaScript变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
