jQuery Validate让普通按钮触发表单验证的方法


Posted in Javascript onDecember 15, 2016

 一般的表单校验都是直接注册在页面上的匿名函数,导致只能通过固定的提交方式触发表单校验,如果想自定义一个按钮触发表单校验如何实现呢?

目前写法:

$(function(){
 $("#form").validate({
  rules : {
   user_name : {
    required : true
   },
   ……
  },
  messages : {
   user_name : {
    required : '用户名必填',
   },
   ……
  }
 });
});

改写方法:

//编写表单验证函数validform,在验证按钮注册按钮点击事件内调用验证函数对象
function validform(){
 /*关键在此增加了一个return,返回的是一个validate对象,这个对象有一个form方法,返回的是是否通过验证*/
 return $("#form").validate({
  rules : {
   user_name : {
    required : true
   },
   ……
  },
  messages : {
   user_name : {
    required : '用户名必填',
   },
   ……
  }
 });
}
//注册表单验证
$(validform());
以上部分已经实现匿名函数的作用,下面介绍如何通过普通按钮实现表单验证
$("#btn").click(function(){
 if(validform().form()) {
  //通过表单验证,以下编写自己的代码
 } else {
  //校验不通过,什么都不用做,校验信息已经正常显示在表单上
 }
});

以上所述是小编给大家介绍的jQuery Validate让普通按钮触发表单验证的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript基础的动画教程,直观易懂
Jan 10 Javascript
游览器中javascript的执行过程(图文)
May 20 Javascript
IE、FF浏览器下修改标签透明度
Jan 28 Javascript
IE中图片的onload事件无效问题和解决方法
Jun 06 Javascript
JavaScript淡入淡出渐变简单实例
Aug 06 Javascript
javascript日期比较方法实例分析
Jun 17 Javascript
JavaScript中获取HTML元素值的三种方法
Jun 20 Javascript
深入理解javascript的getTime()方法
Feb 16 Javascript
Angular4 组件通讯方法大全(推荐)
Jul 12 Javascript
详解使用mpvue开发github小程序总结
Jul 25 Javascript
微信小程序实现的日期午别医生排班表功能示例
Jan 09 Javascript
详解vue 组件的实现原理
Nov 12 Javascript
JavaScript中定义对象原型的两种使用方法
Dec 15 #Javascript
微信公众号开发 实现点击返回按钮就返回到聊天界面
Dec 15 #Javascript
javascript数组去重方法分析
Dec 15 #Javascript
JS碰撞运动实现方法详解
Dec 15 #Javascript
浅述节点的创建及常见功能的实现
Dec 15 #Javascript
Bootstrap整体框架之JavaScript插件架构
Dec 15 #Javascript
如何解决hover在ie6中的兼容性问题
Dec 15 #Javascript
You might like
用php实现批量查询清除一句话后门的代码
2008/01/20 PHP
php5 mysql分页实例代码
2008/04/10 PHP
Discuz 模板语句分析及知识技巧
2009/08/21 PHP
PHP+jquery+CSS制作头像登录窗(仿QQ登陆)
2016/10/20 PHP
php插件Xajax使用方法详解
2017/08/31 PHP
再谈javascript 动态添加样式规则 W3C校检
2009/12/25 Javascript
合并table相同单元格的jquery插件分享(很精简)
2011/06/20 Javascript
js数组的操作详解
2013/03/27 Javascript
JavaScript charCodeAt方法入门实例(用于取得指定位置字符的Unicode编码)
2014/10/17 Javascript
javascript笔记之匿名函数和闭包
2017/02/06 Javascript
vuejs响应用户事件(如点击事件)
2017/03/14 Javascript
Ajax验证用户名或昵称是否已被注册
2017/04/05 Javascript
Angular 4.x+Ionic3踩坑之Ionic3.x pop反向传值详解
2018/03/13 Javascript
node.js中TCP Socket多进程间的消息推送示例详解
2018/07/10 Javascript
thinkjs微信中控之微信鉴权登陆的实现代码
2019/08/08 Javascript
react 不用插件实现数字滚动的效果示例
2020/04/14 Javascript
vue使用vant中的checkbox实现全选功能
2020/11/17 Vue.js
js实现滚动条自动滚动
2020/12/13 Javascript
Python异常处理总结
2014/08/15 Python
深入理解Python中变量赋值的问题
2017/01/12 Python
Python有序查找算法之二分法实例分析
2017/12/11 Python
Python工程师面试必备25条知识点
2018/01/17 Python
python微信跳一跳系列之棋子定位颜色识别
2018/02/26 Python
python实现日常记账本小程序
2018/03/10 Python
Python3中在Anaconda环境下安装basemap包
2018/10/21 Python
Django框架实现的简单分页功能示例
2018/12/04 Python
python使用PIL模块获取图片像素点的方法
2019/01/08 Python
决策树剪枝算法的python实现方法详解
2019/09/18 Python
如何使用Python脚本实现文件拷贝
2019/11/20 Python
h5网页水印SDK的实现代码示例
2019/02/19 HTML / CSS
浅析HTML5 Landmark
2020/09/11 HTML / CSS
班会关于环保演讲稿
2013/12/29 职场文书
鉴定评语大全
2014/05/05 职场文书
体育教师求职信
2014/06/30 职场文书
2014年班主任德育工作总结
2014/12/05 职场文书
Mysql数据库命令大全
2021/05/26 MySQL