script如何接收表单信息
时间: 2023-06-15 13:03:03 浏览: 35
在 script 中接收表单信息的方法比较多,以下是其中两种常用的方法:
1. 使用 document.getElementById() 获取表单元素的值
在 HTML 中,给表单元素设置一个 id 属性,然后在 script 中使用 document.getElementById() 方法获取该元素的值,示例代码如下:
```html
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<button type="submit" onclick="submitForm()">Submit</button>
</form>
<script>
function submitForm() {
const name = document.getElementById('name').value;
console.log(name);
}
</script>
```
上面的代码中,当用户点击 Submit 按钮时,会调用 submitForm() 函数,该函数会获取 name 表单元素的值,并输出到控制台中。
2. 使用 FormData 对象获取表单数据
在 HTML 中,给表单元素设置一个 id 属性,然后在 script 中使用 FormData 对象获取表单数据,示例代码如下:
```html
<form id="myForm">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<button type="submit" onclick="submitForm()">Submit</button>
</form>
<script>
function submitForm() {
const formData = new FormData(document.getElementById('myForm'));
console.log(formData.get('name'));
}
</script>
```
上面的代码中,当用户点击 Submit 按钮时,会调用 submitForm() 函数,该函数会创建一个 FormData 对象,并将表单元素的值存储在该对象中。然后可以使用 get() 方法获取表单元素的值,并输出到控制台中。