- 浏览: 232182 次
- 性别:
- 来自: 北京
文章分类
最新评论
jquery validate 常用的找Api 就好, 但有一些需要自己扩展,比如规则、样式:
1. 自定义规则:
2.自定义样式:
模拟easy ui 自定义样式
1. 自定义规则:
jQuery.validator.addMethod("test", function(value, element) { return this.optional(element) || 1==1); }, "错误提示"); $('#submitForm').validate({ rules: { testAttr: { required:true, stringCheck:true, test:[] } }, message:{ required:"必填", test:"测试" } });
2.自定义样式:
模拟easy ui 自定义样式
input.error { background: url("images/validatebox_warning.png") no-repeat scroll right 1px #FFFFEE; border: 1px solid red; } 重写错误提示 js: $.validator.setDefaults({ showErrors: function(map, list) { // there's probably a way to simplify this /*var focussed = document.activeElement; if (focussed && $(focussed).is("input, textarea")) { $(this.currentForm).tooltip("close", { currentTarget: focussed }, true); }*/ this.currentElements.removeAttr("title").removeClass("ui-state-highlight").removeClass("error"); $.each(list, function(index, error) { $(error.element) .attr("title", error.message).addClass("ui-state-highlight").addClass("error"); $(error.element).tooltip({ openn:true, position: { my: "left top", at: "right+5 top-5" } }); //$(error.element).after('<div class="validatebox-tip" style="display:block;left:164px;top:165px;"><span class="validatebox-tip-content" >test<span></div>'); }); /*if (focussed && $(focussed).is("input, textarea")) { $(this.currentForm).tooltip("open", { target: focussed }); }*/ } });
发表评论
-
web界面父子页面互相调用
2017-10-27 14:25 635父页面:parent.html <!DOCT ... -
多选下拉框的回显(Select)
2015-10-20 17:29 10478多选下拉框打印时候是已数组形式展现的,按这种思路: &l ... -
jqgrid 网址
2015-05-13 16:41 584http://www.trirand.com/blog/jqg ... -
JQuery EasyUI combobox动态添加option
2015-03-20 09:41 1768<input class="easyui-c ... -
easy datagrid 获得page信息
2015-02-03 11:07 650var grid = $('#datagrid'); va ... -
easy ui datagrid api
2015-01-29 12:58 719http://www.jeasyui.com/document ... -
扩展easy ui tree 层级(level)
2014-12-22 10:38 872$.extend($.fn.tree.methods, { ... -
jquery 下拉框按text 选中
2014-11-18 16:03 542jQuery("#separator option[ ... -
jqGrid增加滚动条
2014-10-28 10:15 1960滚动条: $(xxx).jqGrid({ ...... aut ... -
jQuery ui 多选下拉
2014-09-25 11:49 1029下载及代码:http://www.erichynds.com/ ... -
jqGrid 行编辑(select事件)动态追加控件(操作)
2014-09-15 11:26 7479在某个控件后面, 追加一个控件, 在某个控件下面设置 ... -
jqGrid自动适应窗口大小
2014-09-01 17:41 809$(window).resize(function(){ ... -
jqGrid 编辑自定义控件
2014-08-15 16:12 2415jqGrid 支持在某一列上,自己写一个控件显示,并影响弹出编 ... -
Ztree 常用
2014-08-14 17:36 1138Ztree 支持中文API 实在太easy 了, 有了API ... -
针对Ztree的右键弹出菜单(jquery.popupSmallMenu.js)
2014-08-14 10:21 6470例子效果: 右键菜单方便好用的有很多,长用的为jque ... -
jquery ui Message 简单使用
2014-08-12 10:09 1265可以自己在前面加上一张图片 通过operation判断 用哪张 ... -
jQuery ui Combobox 扩展
2014-08-07 15:16 1466jQuery ui 是一个UI的雏形, 一些UI都基于 ... -
jQuery layout 插件属性
2014-07-30 16:08 1663相信很多人在用layout的时候都会找layout到底有多少属 ... -
jqGrid 两种列模型(TypeError: b is undefined)
2014-07-23 18:06 1063jqGrid 的json支持两种列模型 1:如果用普通的js ... -
BS UI
2014-07-21 16:07 383http://www.bootcss.com/ 支持IE6 ...
相关推荐
首先,我们从标题"jquery validate 验证自定义样式"开始。jQuery Validate插件默认提供了一些基本的样式,但这些样式可能不能满足所有设计需求。开发者通常需要根据项目的需求或品牌风格来定制验证的显示效果。这...
jQuery Validate插件是实现表单验证功能的一个强大工具,它提供了丰富的验证规则和自定义选项。然而,默认情况下,jQuery Validate插示错误提示的位置可能并不符合所有项目的需求。本文将详细介绍如何修改jQuery ...
`jQuery Validate`结合自定义CSS样式,可以让表单验证既实用又美观,提供更好的用户体验。 在"jquery validate的漂亮css样式验证"这个主题中,我们主要关注的是如何将`jQuery Validate`与CSS样式相结合,以创建一个...
PoshyTip 是一个基于 jQuery 的高质量提示插件,它提供了多种样式和自定义选项,可以创建美观、动态的提示效果。在上述描述中,开发者提到要利用 PoshyTip 来增强 jQuery Validate 的错误提示功能。当表单验证未通过...
此外,通过自定义样式和错误提示位置,可以提升用户体验。 7. **最佳实践** 使用`jQuery Validate`时,推荐遵循以下最佳实践: - 只对需要验证的字段添加规则,避免不必要的计算和DOM操作。 - 避免在验证规则中...
自定义样式 为了呈现更友好的用户体验,可以自定义错误消息的显示方式。jQuery Validate插件提供了一些选项,如`errorElement`(错误元素类型)、`errorClass`(错误元素类名)和`errorPlacement`(错误消息放置...
《jQuery Validate插件详解与应用指南》 在Web开发领域,表单验证是不可或缺的一环,它能够确保用户输入的数据符合预设的规则,从而提高数据的准确性和系统的稳定性。jQuery Validate是一个强大的JavaScript库,专...
《jQuery Validate修改版:提升表单验证体验》 在网页开发中,用户输入的验证是不可或缺的一环,它能够确保用户提交的数据符合预期,避免无效数据的产生,从而提高用户体验和服务器端处理效率。jQuery Validate插件...
首先,使用 `jQuery validate` 配置表单验证规则,然后在验证通过后,利用 `jQuery form` 的 `submitHandler` 回调函数来发起 AJAX 请求。这样可以确保只有符合验证规则的数据才会被提交,同时保持页面的无刷新特性...
首先,`jQuery Validate`的核心功能是验证用户在表单中输入的数据,确保其符合预设的验证规则。例如,我们可以设定密码必须包含字母、数字、特殊字符等要求,以提高安全性。在提供的例子中,它会检查用户输入的密码...
在本文中,我们将深入探讨如何在jQuery Validate插件中结合Poshytip创建自定义样式的气泡提示。jQuery Validate是一个非常流行的JavaScript库,用于验证HTML表单中的输入数据,而Poshytip则是一个轻量级的jQuery插件...
jQuery Validate 提供了许多预设的验证规则,如 `required`(必填项)、`email`(电子邮件格式)、`url`(URL格式)、`number`(数字)等。这些规则可以通过 `rules` 属性附加到表单元素上: ```javascript $('#...
在`jQuery Validate`的使用中,`formValidator.2.5.2\css\template.css`文件通常包含了样式定义,用于定制验证错误提示的外观。描述中提到“不要引入”可能是因为这个特定的样式文件与用户的项目样式冲突,或者用户...
除了这些基本选项,jQuery Validate还支持许多其他的验证规则,如`required`、`email`、`url`、`minlength`、`maxlength`等,并可以通过`messages`选项自定义错误提示。此外,还可以使用`highlight`、`unhighlight`...
当用户尝试提交表单时,如果输入不符合规则,`jQuery Validate` 会阻止表单提交并显示相应的错误消息。 此外,还可以通过 `.addMethod()` 添加自定义验证方法,或者通过 `.rules('add')` 在运行时动态添加验证规则...
在本文中,我们将深入探讨如何使用jQuery Validate插件实现自定义表单验证,特别是如何自定义一个验证方法。 首先,要使用jQuery Validate插件,你需要在页面中引入jQuery库以及jQuery Validate插件的JavaScript...
为了解决这个问题,我们需要自定义jQuery Validate的错误消息样式,使其与Bootstrap的样式相匹配。例如,可以设置错误消息的class为Bootstrap的`.help-block`或`.alert`类。 2. **错误元素的插入位置**:jQuery ...
jQuery Validate提供了多种内置的验证规则,如`required`(必填)、`number`(数字)、`email`(电子邮件地址)、`url`(网址)和`creditcard`(信用卡号)。这些规则可以直接应用到表单元素上,无需额外编写验证...
`jQuery Validate`允许你定义自定义验证规则和错误消息。例如,要求必填字段,你可以这样设置: ```javascript rules: { name: "required", }, messages: { name: "请输入您的姓名", } ``` ### 4. 验证事件与回...