爱程序网

jQuery清除表单数据代码实例

来源: 阅读:

jQuery清除表单数据代码实例:
清除表单中的数据最简单的方法,就是点击重置按钮实现清空效果,但是在实际应用中可能需要根据代码的具体运行情况来清除表单中的数据,下面就分享一段能够实现此功能的jQuery代码。

 

function clearForm(form) {
  $(':input', form).each(function() {
    var type = this.type;
    var tag = this.tagName.toLowerCase();
    if (type == 'text' || type == 'password' || tag == 'textarea')
      this.value = "";
    else if (type == 'checkbox' || type == 'radio')
      this.checked = false;
    else if (tag == 'select')
      this.selectedIndex = -1;
  });
};

 

以上代码实现了我们的要求,下面对代码做一下简单注释。
一.代码注释:
1.function clearForm(form) {},参数为表单对象。
2.$(':input', form).each(function() {}),遍历表单中的每一个input元素。
3.var type = this.type,获取input元素的type属性值。
4.var tag = this.tagName.toLowerCase(),获取标签名称并且将标签名转换为小写。
5.if (type == 'text' || type == 'password' || tag == 'textarea') this.value = "",如果input元素的类型为文本或者密码框或者标签为多行文本框,就将value属性值设置为空。
6.else if (type == 'checkbox' || type == 'radio') this.checked = false,如果为单选框或者复选框,那么就取消选中。
7.else if (tag == 'select') this.selectedIndex = -1,如果是select下拉菜单,就取消选中项。
二.相关阅读:
1.jQuery.each()方法可以参阅jQuery.each()方法一章节。
2.type属性可以参阅
javascript的text.type属性一章节。
3.tagName属性可以参阅javascript如何获取元素的tagName标签名一章节。  
4.toLowerCase()函数可以参阅javascript的String对象的toLowerCase()方法一章节。
5.checked属性可以参阅javascript的checkbox.checked属性一章节。 
6.selectedIndex属性可以参阅javascript的select.selectedIndex属性一章节。 

更多内容可以参阅:http://www.softwhy.com/forum.php?mod=viewthread&tid=12219

更多内容可以参阅:http://www.softwhy.com/jquery/

 

关于爱程序网 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助