前端---表单提交

1. 表单属性设置

<form>标签 表示表单标签，定义整体的表单区域

• action属性 设置表单数据提交地址
• method属性 设置表单提交的方式，一般有“GET”方式和“POST”方式, 不区分大小写

2. 表单元素属性设置

• name属性 设置表单元素的名称，该名称是提交数据时的参数名
• value属性 设置表单元素的值，该值是提交数据时参数名所对应的值

3. 示例代码

 <form action="https://www.baidu.com" method="GET"><p><label>姓名：</label><input type="text" name="username" value="11" /></p><p><label>密码：</label><input type="password" name="password" /></p><p><label>性别：</label><input type="radio" name="gender" value="0" /> 男<input type="radio" name="gender" value="1" /> 女</p><p><label>爱好：</label><input type="checkbox" name="like" value="sing" /> 唱歌<input type="checkbox" name="like" value="run" /> 跑步<input type="checkbox" name="like" value="swiming" /> 游泳</p><p><label>照片：</label><input type="file" name="person_pic"></p><p><label>个人描述：</label><textarea name="about"></textarea></p><p><label>籍贯：</label><select name="site"><option value="0">北京</option><option value="1">上海</option><option value="2">广州</option><option value="3">深圳</option></select></p><p><input type="submit" name="" value="提交"><input type="reset" name="" value="重置"></p>
</form>

小结

• 表单标签的作用就是可以把用户输入数据一起提交到web服务器。
• 表单属性设置
  • action: 是设置表单数据提交地址
  • method: 是表单提交方式，提交方式有GET和POST
• 表单元素属性设置
  • name: 表单元素的名称，用于作为提交表单数据时的参数名
  • value: 表单元素的值，用于作为提交表单数据时参数名所对应的值