jquery.form.js用法之清空form的方法


Posted in Javascript onMarch 07, 2014

本段代码摘取自jquery.form.js中,由于觉得该方法的使用性非常强,同时也可独立拿出来使用。
该段代码言简意赅可以很好的作为学习参考。

/**
 * Clears the form data. Takes the following actions on the form's input fields:
 * - input text fields will have their 'value' property set to the empty string
 * - select elements will have their 'selectedIndex' property set to -1
 * - checkbox and radio inputs will have their 'checked' property set to false
 * - inputs of type submit, button, reset, and hidden will *not* be effected
 * - button elements will *not* be effected
 */
$.fn.clearForm = function(includeHidden) {
    return this.each(function() {
        $('input,select,textarea', this).clearFields(includeHidden);   //this表示设置上下文环境,有多个表单时只作用调用的表单
    });
};
$.fn.clearFields = $.fn.clearInputs = function(includeHidden) {
    var re = /^(?:color|date|datetime|email|month|number|password|range|search|tel|text|time|url|week)$/i; // 'hidden' is not in this list
    return this.each(function() {
        var t = this.type, tag = this.tagName.toLowerCase();
        if (re.test(t) || tag == 'textarea') {
            this.value = '';
        }
        else if (t == 'checkbox' || t == 'radio') {
            this.checked = false;
        }
        else if (tag == 'select') {
            this.selectedIndex = -1;
        } 
        else if (t == "file") {
            if (/MSIE/.test(navigator.userAgent)) {
                 $(this).replaceWith($(this).clone(true));
            } else {
                 $(this).val('');
            }
       }
        else if (includeHidden) {
            // includeHidden can be the value true, or it can be a selector string
            // indicating a special test; for example:
            // $('#myForm').clearForm('.special:hidden')
            // the above would clean hidden inputs that have the class of 'special'
            if ( (includeHidden === true && /hidden/.test(t)) ||
                 (typeof includeHidden == 'string' && $(this).is(includeHidden)) ) {
                this.value = '';
            }
        }
    });
};
Javascript 相关文章推荐
jquery的extend和fn.extend的使用说明
Jan 09 Javascript
JavaScript按值删除数组元素的方法
Apr 24 Javascript
详解JS正则replace的使用方法
Mar 06 Javascript
JS DOM实现鼠标滑动图片效果
Sep 17 Javascript
jQuery实现的简单拖拽功能示例
Sep 13 Javascript
Javascript农历与公历相互转换的简单实例
Oct 09 Javascript
从零开始学习Node.js系列教程之SQLite3和MongoDB用法分析
Apr 13 Javascript
jq源码解析之绑在$,jQuery上面的方法(实例讲解)
Oct 13 jQuery
vue中路由参数传递可能会遇到的坑
Dec 07 Javascript
在vue项目中使用Nprogress.js进度条的方法
Jan 31 Javascript
详解小程序input框失焦事件在提交事件前的处理
May 05 Javascript
Element Dropdown下拉菜单的使用方法
Jul 26 Javascript
jquery设置按钮停顿3秒不可用
Mar 07 #Javascript
jquery 实现两级导航菜单附效果图
Mar 07 #Javascript
document.addEventListener使用介绍
Mar 07 #Javascript
开发中可能会用到的jQuery小技巧
Mar 07 #Javascript
javascript匿名函数应用示例介绍
Mar 07 #Javascript
js登录弹出层特效
Mar 07 #Javascript
JavaScript通过正则表达式实现表单验证电话号码
Mar 07 #Javascript
You might like
php侧拉菜单 漂亮,可以向右或者向左展开,支持FF,IE
2009/10/15 PHP
PHP 读取Postgresql中的数组
2013/04/14 PHP
PHP入门教程之使用Mysqli操作数据库的方法(连接,查询,事务回滚等)
2016/09/11 PHP
ko knockoutjs动态属性绑定技巧应用
2012/11/14 Javascript
JS判断、校验MAC地址的2个实例
2014/05/05 Javascript
javascript 自定义回调函数示例代码
2014/09/26 Javascript
js获取会话框prompt的返回值的方法
2015/01/10 Javascript
jQuery EasyUI 菜单与按钮之创建简单的菜单和链接按钮
2015/11/18 Javascript
深入理解jQuery之防止冒泡事件
2016/05/24 Javascript
Node.js DES加密的简单实现
2016/07/07 Javascript
在DWR中实现直接获取一个JAVA类的返回值的两种方法
2016/12/25 Javascript
canvas实现动态小球重叠效果
2017/02/06 Javascript
JS实现禁止高频率连续点击的方法【基于ES6语法】
2017/04/25 Javascript
JavaScript数据结构之优先队列与循环队列实例详解
2017/10/27 Javascript
解析vue、angular深度作用选择器
2019/09/11 Javascript
vue中使用rem布局代码详解
2019/10/30 Javascript
用Golang运行JavaScript的实现示例
2019/11/25 Javascript
Vue前端项目部署IIS的实现
2020/01/06 Javascript
基于VSCode调试网页JavaScript代码过程详解
2020/07/20 Javascript
vue项目页面嵌入代码块vue-prism-editor的实现
2020/10/30 Javascript
[03:04]2018年国际邀请赛典藏宝瓶&莱恩声望物品展示 片尾有彩蛋
2018/06/04 DOTA
Python爬取十篇新闻统计TF-IDF
2018/01/03 Python
Python自动化完成tb喵币任务的操作方法
2019/10/30 Python
浅析Python3 pip换源问题
2020/01/06 Python
Pycharm中切换pytorch的环境和配置的教程详解
2020/03/13 Python
Python面向对象程序设计之类和对象、实例变量、类变量用法分析
2020/03/23 Python
Python实现发票自动校核微信机器人的方法
2020/05/22 Python
html5是什么_动力节点Java学院整理
2017/07/07 HTML / CSS
暇步士官网:Hush Puppies
2016/09/22 全球购物
阿巴庭院:Abba Patio
2019/06/18 全球购物
《少年王冕》教学反思
2014/04/11 职场文书
自主招生自荐信范文
2015/03/04 职场文书
公司慰问信范文
2015/03/23 职场文书
2015年纪委工作总结
2015/05/13 职场文书
数学复习课教学反思
2016/02/18 职场文书
Java详细解析==和equals的区别
2022/04/07 Java/Android