`
wei5201
  • 浏览: 187580 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

jquery validate的使用技巧

    博客分类:
  • js
阅读更多
统一加上validate验证,可以包括暂存和真实存储,数据暂存的时候,可以调用setRulesByAttr("form","saveValid")方法验证数据合法性后,提交数据至缓存空间,如memcached.

 /**
    * 重置所有input select之类表单项的验证规则
    * 接受若干个参数 参数对应相关表单项的自定义属性名,属性值是可以转换为rule的json字串
    * 例如:<input saveValid="{required:true}" validateValid="{required:true,number:true}" " type="text" value="" />
    * 在调用时至少要有一个参数 是form的ID
    * 另外 如果标签的自定义属性ignoreRules是"true"字串 那么这个标签将不会被验证
    *例子:<input name="zinv.alimony" saveValid="{number:true}" validateValid="{number:true,required:true}" value="${fn:escapeXml(zinv.alimony)}" type="text" size="10" />元/月
    *调用方式: setRulesByAttr("form","saveValid")或setRulesByAttr("form","validateValid");
    */
    function setRulesByAttr(formId){
        //传入的第一个元素为表单
        var frm = $("#" + arguments[0]);
        var e = frm.find("input, select, textarea");
        // 遍历每个元素
        for(var i = 0; i < e.length; i++){
            var je = $(e[i]);
            // 是否有时间控件
        	var onf = je.attr("onfocus");
        	var hasDate = false;
        	if(onf != null && onf.toString().indexOf("WdatePicker") >= 0)
        		hasDate = true;
            
            // 清空验证规则
            try{
                je.rules("remove");
            }catch(exx){
            //document.ready里必须加上$('#formId...').validate()
                alert("移除对象验证规则错,是否缺少$('#formId...').validate()方法\n" + exx.name + "\n" + exx.message);
                continue;
            }
            //如果只传递了一个formId,那么意思就是说取消所有validate验证规则
            if(arguments.length <= 1)
                continue;

            // 判断对象的ignoreRules,true的话,忽略validate验证规则
            var irs = je.attr("ignoreRules");
            if(irs != null && $.trim(irs) == "true")
                continue;

            // 遍历所有属性,如'saveValid'属性,            
            for(var j=1; j<arguments.length; j++){
                // rule的属性名
                var a = $.trim(arguments[j]);
                // 取出属性值
                var asv = je.attr(a);
                if(asv != null && $.trim(asv).length > 0){
                    // 将属性值转为rule json
                    try{
                       //将json串转换为json对象.
                       var jr = eval("(" + asv + ")");
                       if(hasDate){
                       		// 如果有日历控件 那么强制加上时间验证
                       	jr.dateISO = true;
                       }
                       // 增加验证规则,这种增加方式出于validate框架支持
                       je.rules("add", jr);
                    }catch(ex){
                       // 转换出错
                       alert("无法将“" + asv + "”转换成合法的json");
                    }
                }
            }
        }
    }



这样就避免了大量的js验证代码存在于每个不同的页面中!

:)
分享到:
评论

相关推荐

    jquery validate 验证手册

    总的来说,《jQuery Validate验证手册》是前端开发者的宝贵资源,无论你是初学者还是经验丰富的开发者,都能从中获取到关于表单验证的实用知识和技巧。通过深入学习和实践,你将能够构建出更加健壮、用户友好的表单...

    jquery.validate.js 和 帮助文档.rar

    本文将深入探讨jQuery validate.js的核心功能及其API,同时结合提供的帮助文档,为你揭示其背后的实现原理和使用技巧。 首先,jQuery validate.js的主要功能是为HTML表单提供强大的验证规则。通过简单的配置,...

    jquery validate

    - `jb51.net.txt`可能是一份关于jQuery Validate的教程或技巧集合,可以进一步学习和应用。 - `脚本之家.url`和`服务器软件.url`可能指向了更多jQuery Validate的教程或者相关开发资源,可以作为扩展学习的入口。 ...

    jQuery Validate 数组 全部验证问题

    总之,jQuery Validate在处理数组验证时,可能需要一些额外的技巧来确保所有元素都满足验证条件。通过自定义验证方法,我们可以更好地控制数组类型的输入验证,从而提供更加健壮的表单验证体验。在实际开发中,确保...

    jQuery Validate

    jQuery Validate自2006年起就开始存在,并持续更新,当前稳定版本为1.14.0。 ### 主要功能 1. **验证方法**:jQuery Validate内置了一系列预设的验证规则,如检查URL、电子邮件格式等。这些规则可以直接应用于表单...

    jquery表单验证框架:jquery.validate.zip

    jQuery是一个广泛使用的JavaScript库,而jQuery.validate则是jQuery的一个强大插件,专门用于实现客户端的表单验证。本篇文章将详细介绍jQuery.validate框架及其核心功能。 一、jQuery.validate简介 jQuery....

    jQuery.validate.js表单验证及API

    本文将深入探讨jQuery.validate.js的核心功能、API使用方法以及一些常见的使用场景。 首先,jQuery.validate.js是由Jörn Zaefferer创建的一个轻量级插件,它是jQuery Form Plugin的一部分,主要用于简化HTML表单的...

    jquery-validate 表单验证

    `jQuery Validate` 是一个强大的 JavaScript 库,专为 jQuery 框架设计,用于实现高效、灵活且易于使用的表单验证。它可以帮助开发者创建各种复杂的验证规则,确保用户输入的数据符合预设的要求,从而提高网站的安全...

    jquery.validate.js

    《jQuery validate.js插件详解与应用实践》 在Web开发中,表单验证是不可...掌握其使用技巧,能够显著提升Web应用的质量和用户体验。在实际项目中,结合适当的服务器端验证策略,可以构建出更安全、更智能的表单系统。

    Validate-jquery.zip

    1. **安装与引入**:在项目中使用jQuery Validate插件,首先需要确保已经引入了jQuery库,然后可以通过CDN或者本地文件引入validate.js和对应的CSS文件。例如,在HTML文件的`&lt;head&gt;`标签内添加如下代码: ```html ...

    jquery.validate提示错误信息位置方法

    使用jQuery Validate插件时,开发者可以通过定义不同的验证规则(rules),自定义验证消息(messages),以及验证成功后执行的回调(success)函数等。其中,错误信息的显示位置对于用户来说至关重要,直观的提示...

    使用jQuery validate 验证注册表单实例演示

    综上所述,通过使用jQuery validate插件,开发者可以有效地简化表单验证的过程,提高工作效率,并且为用户提供即时的反馈信息。对于需要进行复杂表单验证的网页应用来说,jQuery validate是一个不可或缺的工具。在...

    jQuery应用技巧大全

    jQuery拥有丰富的插件生态系统,如jQuery UI提供各种界面组件,jQuery Validate用于表单验证,以及许多第三方插件如Bootstrap、Isotope等。熟练运用这些插件,可以快速实现复杂功能,提升用户体验。 七、性能优化 ...

    jQuery表单校验插件validate实例代码集展现了插件的各种用法.zip

    jQuery是JavaScript库中的一款强大的工具,它极大地简化了DOM操作、事件处理以及动画效果的创建。...这个压缩包的实例代码集是学习和参考的好材料,可以帮助开发者快速掌握validate插件的使用技巧。

    jquery使用手册

    在这个《jQuery使用手册》中,我们将深入探讨jQuery的核心概念和实用技巧,帮助你提升网页开发效率。 ### 一、jQuery选择器 jQuery的选择器是其强大功能之一,它们借鉴了CSS选择器,使你能快速定位到页面上的元素。...

    关于jquery.validate1.9.0前台验证的使用介绍

    关于jQuery Validate 1.9.0插件的使用,它是一个强大的前端表单验证库,用于确保用户在提交数据之前填写了正确的信息。在本文中,我们将深入探讨如何有效地使用这个插件,以及如何处理一些常见问题。 首先,我们要...

    jQuery学习资料

    `jQuery.validate.js+API中文.pdf`文档将详细解释如何配置验证规则、显示错误消息、自定义验证方法,以及与jQuery的其他功能结合使用。 3. **Jquery特效.pdf** jQuery的动画效果是其魅力的一部分。`Jquery特效.pdf...

    jquery手册-jQuery1.3

    《jQuery1.3使用手册》是一本针对...总之,《jQuery1.3使用手册》涵盖了jQuery的基本用法到高级技巧,是学习和掌握jQuery不可或缺的资源。无论你是初学者还是经验丰富的开发者,都可以从中受益,提升你的前端开发技能。

    jquery 校验大全 实例

    在IT行业中,jQuery是一个非常...无论是初学者还是经验丰富的开发者,都能从中受益匪浅,理解并掌握jQuery验证的各种技巧和最佳实践。通过深入研究和实践这些实例,你将能够构建出更加健壮、用户友好的Web应用程序。

    jQuery学习手册

    当使用这些规则时,jQuery Validate插件还提供了一系列默认的错误提示消息,这些消息可以通过`messages`对象进行自定义,以适应不同语言环境或个性化需求。例如,如果用户输入的不是有效的邮箱地址,会显示`"Please ...

Global site tag (gtag.js) - Google Analytics