对于juqery的验证框架 实在是不想用 但是没办法项目组要用统一的验证方式对于jquery的验证最常见的写法就是 如下:
$("#addressForm").validate({
rules: {
'memberAddress.name':{
required: true,
minlength:1,
maxlength:20
},
'memberAddress.address':{
required: true,
minlength:1,
maxlength:128
},
'memberAddress.postcode':{
required: true,
minlength:6,
maxlength:6,
number:true
},
'memberAddress.zoneCode':{
minlength:3,
maxlength:4,
number:true
},
'memberAddress.tel':{
minlength:7,
maxlength:8,
number:true
},
'memberAddress.mobile':{
minlength:11,
maxlength:11,
number:true
}
},
messages: {
'memberAddress.name': {
required: '请输联系人姓名',
minlength: '请输联系人姓名',
maxlength: '联系人姓名的最大长度为20'
},
'memberAddress.address':{
required:'请输入联系地址',
minlength:'请输入联系地址',
maxlength:'联系地址最大长度为128'
},
'memberAddress.postcode':{
required:'请输入邮编',
minlength:'请输入正确的邮编',
maxlength:'请输入正确的邮编',
number:'请输入正确的邮编'
},
'memberAddress.zoneCode':{
minlength:'请输入正确的区号',
maxlength:'请输入正确的区号',
number:'请输入正确的区号'
},
'memberAddress.tel':{
minlength:'请输入正确的电话',
maxlength:'请输入正确的电话',
number:'请输入正确的电话'
},
'memberAddress.mobile':{
minlength:'请输入正确的手机号',
maxlength:'请输入正确的手机号',
number:'请输入正确的手机号'
}
},
errorElement: "span",
errorClass: "error",
success:"checked",
submitHandler : function() {//控制是否提交,可以不写
return checkInfo();
}
});
但是假设我的表单是ajax提交的的 哪怎么办呢
可以这样写:
validate=$("#addressForm").validate({
rules: {
'memberAddress.name':{
required: true,
minlength:1,
maxlength:20
},
'memberAddress.address':{
required: true,
minlength:1,
maxlength:128
},
'memberAddress.postcode':{
required: true,
minlength:6,
maxlength:6,
number:true
},
'memberAddress.zoneCode':{
minlength:3,
maxlength:4,
number:true
},
'memberAddress.tel':{
minlength:7,
maxlength:8,
number:true
},
'memberAddress.mobile':{
minlength:11,
maxlength:11,
number:true
}
},
messages: {
'memberAddress.name': {
required: '请输联系人姓名',
minlength: '请输联系人姓名',
maxlength: '联系人姓名的最大长度为20'
},
'memberAddress.address':{
required:'请输入联系地址',
minlength:'请输入联系地址',
maxlength:'联系地址最大长度为128'
},
'memberAddress.postcode':{
required:'请输入邮编',
minlength:'请输入正确的邮编',
maxlength:'请输入正确的邮编',
number:'请输入正确的邮编'
},
'memberAddress.zoneCode':{
minlength:'请输入正确的区号',
maxlength:'请输入正确的区号',
number:'请输入正确的区号'
},
'memberAddress.tel':{
minlength:'请输入正确的电话',
maxlength:'请输入正确的电话',
number:'请输入正确的电话'
},
'memberAddress.mobile':{
minlength:'请输入正确的手机号',
maxlength:'请输入正确的手机号',
number:'请输入正确的手机号'
}
},
errorElement: "span",
errorClass: "error",
success:"checked",
submitHandler : function() {//控制是否提交,可以不写
return checkInfo();
}
});
然后 在你提交前触发的function中
function submitform(){
var f=validate.form();
if(f){}else{}
}
好了这样就行了
分享到:
相关推荐
这篇文章主要讲述了如何使用layui插件进行表单验证以及提交触发提交的实现方法。下面,我们将详细解析文章中涉及到的关键知识点。 ### 一、Layui框架介绍 Layui是一个前端UI框架,它提供了一套简单易用的界面元素...
使layui.js form 可主动验证表单是否通过。扩展layui下的form.js 。文章链接 https://blog.csdn.net/qq_17837497/article/details/107505486
`validateForm`函数会在用户点击提交按钮时触发,如果输入的邮件地址不符合正则表达式,就会弹出警告并阻止表单提交。 `PageValidate.js`文件很可能是这个验证大全的一部分,它可能包含了预定义的各种正则表达式...
- **onchange事件**:当元素的值改变且失去焦点时触发,适用于提交前验证。 4. **自定义验证函数** - 可以创建自定义验证函数,根据业务需求定制验证逻辑,如检查密码强度、验证用户名唯一性等。 5. **表单元素...
5. **回调函数**:成功或失败的验证结果通常会触发预定义的回调函数,以便在验证完成后执行相应的业务逻辑。 6. **安全性**:除了基本的验证功能,源码可能还包括一些安全措施,如防止快速多次尝试、防止模拟器自动...
5. **实时实现**:在实际应用中,事件触发控制需要与硬件相结合,考虑到实时性和执行效率,可能需要特殊的嵌入式系统或硬件在环(Hardware-in-the-Loop)仿真来验证其可行性。 6. **仿真工具**:"singularly3.slx...
1. **事件监听**:使用JavaScript监听表单元素的`onchange`、`onkeyup`等事件,当用户输入时触发AJAX请求。 2. **创建XMLHttpRequest对象**:实例化一个XMLHttpRequest对象,用于与服务器进行通信。 3. **发送请求**...
3. 事件绑定:`.on()`方法允许我们绑定事件监听器,例如`change`、`blur`、`keyup`等,这些事件在用户交互时触发验证。 二、jQuery验证插件 1. jQuery Validation Plugin:这是最常用的jQuery表单验证插件,它提供...
HTML5的`required`属性就是一个简单的非空验证方式,如果用户未填写该字段,提交表单时会触发错误。在jQuery中,我们可以通过`$.trim()`方法去除前后空格,再检查字符串长度,以实现更精细的非空验证。 5. **事件...
源代码可能会展示如何定义验证规则,如何处理错误,以及如何在用户提交表单前触发验证。通过阅读和理解这部分代码,我们可以学习到如何根据业务需求定制验证逻辑。 至于`dangdang.sql`,由于其扩展名是SQL,这通常...
4. **事件监听**:添加鼠标或触摸事件监听器,当用户与滑块交互时,触发对应的处理函数。这些处理函数会更新滑块的位置,并检查是否完成验证。 5. **验证逻辑**:当滑块被拖动到正确位置时,进行验证逻辑。这通常...
1. CSV导出:通过创建一个包含所有数据的大型字符串,使用换行符和逗号分隔每一行和每一列,然后设置`Content-Type`为`text/csv`并触发浏览器下载。 2. XLSX库:可以使用如` SheetJS`这样的库,它提供了处理和生成...
ASP.NET还提供了一些验证相关的事件,如Page.Validate(),可以手动触发验证;还有Validating和Validated事件,可以在验证过程中进行进一步的处理。 8. **AJAX验证**: 使用ASP.NET AJAX,可以实现无刷新验证,...
当数据模型的属性改变时,验证规则会被触发,如果输入不合法,将返回错误消息。 2. **验证规则类**:WPF允许你通过继承`ValidationRule`类创建自定义的验证规则。这些规则在数据绑定发生时被调用,你可以在`...
2. **事件绑定**:使用`.on()`方法绑定事件监听器,如`change`、`blur`或`keyup`事件,每当用户改变输入或离开输入框时触发验证。 3. **验证函数**:编写验证函数,检查用户输入是否符合规则。例如,检查邮箱格式...
- **onsubmit**:在表单提交时触发验证,如果验证失败则阻止表单的默认提交行为。 - **onchange**:当表单元素值改变时触发,实时验证用户输入。 - **onblur**:当用户离开输入框时触发,提供离开后的一次性验证...
4. **事件处理**:提供事件接口,如`validate`和`reset`,用于手动触发验证或重置表单状态。 5. **自定义规则**:提供扩展接口,允许用户根据项目需求添加自定义验证规则。 `vue-verify-master`这个压缩包很可能...
- `onsubmit`:在表单提交时触发验证。 - `onblur`:当元素失去焦点时执行验证。 - `onchange`:在元素值改变时进行验证。 4. **错误提示**: - 使用`setCustomValidity`方法设置自定义验证错误信息。 - `...
BootStrapValidator表单验证插件的坑还真不少,又让我碰上一个… BootStrapValidator验证的表单中只可有一个 type="submit" 的按钮。 我这样写了之后 (代码如下) ,点击其它按钮仍会触发验证… 1.错误代码 //...
用户点击登录按钮后,需要触发一个事件来执行验证操作。Java中的ActionListener接口可以实现这一功能,我们可以通过实现其actionPerformed()方法来定义当按钮被点击时执行的逻辑。 5. **数据验证** 在用户提交...