https://www.runoob.com/html/html-forms.html #review/前端/基础/html
储存表单数据
- 通过input标签来获取值,input中的name属性就是变量名
数组
html表单里面相同的变量名被赋予多个值, 默认会合并成数组
提交表单
常规表单
- 点击type=“submit”的input按钮会触发表单的提交
- form 表单的action属性可以将表单数据传给另一个文件
- 默认把表单数据传递给自己
单输入表单
W3C 标准定义:
当一个表单中只有一个单行文本输入字段时, 浏览器应当将在此字段中按下 Enter (回车键)的行为视为提交表单的请求。
示例
<!DOCTYPE html>
<html>
<head>
<title>简单表单示例</title>
</head>
<body>
<h2>注册表单</h2>
<form action="/submit_form" method="post">
<!-- 文本框 -->
<label for="fname">名字:</label><br>
<input type="text" id="fname" name="fname"><br>
<!-- 密码框 -->
<label for="password">密码:</label><br>
<input type="password" id="password" name="password"><br>
<!-- 电子邮箱 -->
<label for="email">电子邮箱:</label><br>
<input type="email" id="email" name="email"><br>
<!-- 单选按钮 -->
<!-- 根据设定相同的name来产生互斥选项 -->
<p>性别:</p>
<input type="radio" id="male" name="gender" value="male">
<label for="male">男</label><br>
<input type="radio" id="female" name="gender" value="female">
<label for="female">女</label><br>
<!-- 复选框 -->
<p>你的爱好:</p>
<input type="checkbox" id="hobby1" name="hobby1" value="Swimming">
<label for="hobby1"> 游泳</label><br>
<input type="checkbox" id="hobby2" name="hobby2" value="Reading">
<label for="hobby2"> 阅读</label><br>
<!-- 下拉列表 -->
<label for="country">国家:</label><br>
<select id="country" name="country">
<option value="china">中国</option>
<option value="japan">日本</option>
<option value="korea">韩国</option>
</select><br><br>
<!-- 提交按钮 -->
<input type="submit" value="提交">
</form>
</body>
</html>