清空网页表单的所有text文本框（select选择框）的两种方法

　　网页表单是用来给用户提交资料的，用户在输入资料的时候总有输错之时，因此一个表单除具有提交按钮外，清空按钮也不能少，以便用户输错所有项时把所有text文本框、select选择框、check复选框等清空。

　　清空网页表单的所有text文本框、select选择框、check复选框等一般有两种方法，一种方法使用 input 把 type 设置为 button 或 submit，然后用一句 javascript 代码搞定；另一种方法直接用一个重置按钮，更方面更省事。下面分别列举这两种方法的实例。

　　一、清空网页表单的所有text文本框（select选择框）方法一

　　html代码：

　　<form method="get" action="">
　　　<ul class="ul">
　　　　<li>分类：<select id="selectId"><option>请选择</option><option>台式电脑</option><option>笔记本电脑</option></select></li>
　　　　<li>名称：<input type="text" id="inProduct" maxlength="100" /></li>
　　　　<li>价格：<input type="text" id="inPrice" maxlength="10" /></li>
　　　　<li><input type="submit" id="inSub" value=" 提 交 " />
<input type="button" name="inClear" value=" 清 空 " onclick="document.forms[0].reset()" /></li>
　　　</ul>
　　</form>

　　CSS代码：

　　.ul{margin:10px 0px; position:relative; border:1px solid #787878; width:350px; height:160px; line-height:30px;}
　　.ul li{margin:6px 0 0 10px;}

　　单击“清空”按钮后，不但能清空所有text文本框，并且还能清空 select选择、check复选框等；发挥作用的代码仅一句，即 document.forms[0].reset()。

　　二、清空网页表单的所有text文本框（select选择框）方法二：简便法

　　html代码都与方法一相同，只需要把 <input type="button" name="inCleaer" value=" 清 空 " onclick="document.forms[0].reset()" /> 改为如下代码：

　　<input type="reset" name="inClear" value=" 清 空 " />

　　只是把 input 的类型 type 改为了 reset，不需要在单击事件 onclick 中写 javascript 代码了，更简洁方便。