HTML如何清空表单信息

如果 reset按钮不管用的话（reset要放到form标签中）

有个麻烦办法

那就是

设置每个input的value为空

document.getElementById("name").value=""

所有都这样设置

或者

for(var i=0i<document.getElementByTagName("input").lengthi++){

document.getElementByTagName("input")[i].value=""

}

HTML <input>标签的 type 属性 设置重置按钮

定义和用法

type 属性规定 input 元素的类型。

语法：<input type="value">

属性值

 button    

   定义可点击按钮（多数情况下，用于通过 JavaScript 启动脚本）。    

 checkbox    

   定义复选框。    

 file    

   定义输入字段和 "浏览"按钮，供文件上传。    

 hidden    

   定义隐藏的输入字段。    

 image    

   定义图像形式的提交按钮。    

 password    

   定义密码字段。该字段中的字符被掩码。    

 radio    

   定义单选按钮。    

 reset    

   定义重置按钮。重置按钮会清除表单中的所有数据。    

 submit    

   定义提交按钮。提交按钮会把表单数据发送到服务器。    

 text    

   定义单行的输入字段，用户可在其中输入文本。默认宽度为 20 个字符。 

实例

<!--定义重置按钮。重置按钮会清除表单中的所有数据。-->

<input type="reset" value="重置" />

我们在浏览一些网站时经常会用到一种网页元素--表单。如下图，像这样允许用户输入并使用按钮提交信息的功能，我们称之为表单，那么接下来介绍HTML表单相关的一些知识点。

1)表单:帮助服务器收集客户端信息的一种机制

<form action="提交到的页面" method="提交的方法">

表单控件

form>

action:数据最后所提交的页面 绝对路径/相对路径

method:数据提交服务器时的提交方法 post get

2)表单控件:表单用于用户填写信息的控件

1、文本控件: 用于用户填写较少信息，且可以显示用户填写信息的控件

(注册时，用户名填写)

格式:

<input type="text" name=""  id=""  value="" size="" placeholder=""/>

type:设置控件样式 text

name:用于表单收集信息的一种标示符，也就是控件的名称

2、密码框:只是用户输入的内容看不到

<input type="password" name="" id=""  size=""/>

3、单选按钮组:由多个单选按钮组成的按钮组，只能选中其中一个，这种按钮组

<input type='radio' name="" value="" checked>标示符

name:为了保证传递服务器数据只有一个，所以name值必须相同

value：是用提交服务器时，该标签被提交的数据,value不能相同

checked:默认按钮组中的那个按钮被选中

性别:<input type='radio' name="" value="" checked>男

<input type='radio' name="" value="" checked>女

<input type='radio' name="" value="" checked>保密

所有表单控件name值不能相同!!!

4、复选按钮组: 与单选按钮组的区别可以选择多个，为了能将用户选择的多项内容传递服务器中，要将name名字后面加个[]

格式:

<input type='checkbox' name="" id="" value="" checked>标示

选课:

<input type='checkbox' name='classes[]' checked value='1'>语文

<input type='checkbox' name='classes[]'  value='2'>数学

<input type='checkbox' name='classes[]'  value='3'>历史

<input type='checkbox' name='classes[]'  value='4'>政治

<input type='checkbox' name='classes[]'  value='5'>物理

<input type='checkbox' name='classes[]'  value='6'>化学

<input type='checkbox' name='classes[]' checked value='7'>美术

注意：一定要在name属性后面添加[]

5)下拉列表框:

格式:

<select name="" >

<option value="" selected>下拉列表项option>

<option value="" >下拉列表项option>

<option value="" >下拉列表项option>

<option value="" >下拉列表项option>

<option value="" >下拉列表项option>

select>

multiple:允许用户选中多个下拉列表项

optgroup: 设置下拉分类标示

6) 文本域：可以输入多行数据的表单控件

<textarea name="" id="" cols="" rows="">

内容

textarea>

rows:设置文本域可以输入的行数

cols:设置的文本域输入的列数(一行可以输入多少个字符)(不是PX)

个人介绍:

<textarea name='descs' cols="50" rows="10">

我是个学生

textarea>

7)隐藏域：

<input type="hidden" name = “”value =””>

8)上传控件：

<input type="file" name=””>

9)按钮标签:

普通按钮:为js提供的控件

<input type='button' name=”” value=""/>

value：按钮中显示的数据和提交到服务器后该控件提交的值

<input type='button' name='clicks' value="点我"/>

提交按钮:点击后可以提交表单

<input type='submit' name="add" value='注册'/>

重置按钮:点击后可以将用户输入的数据清空

<input type='reset' name='cancel' value='重置'>

图片提交按钮:使用图片作为提交按钮

<input type='image' src='图片地址' name=””>

本文的分享就到这，希望我的回答能帮到你。

---