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 相关文章推荐
Js日期选择器并自动加入到输入框中示例代码
Aug 02 Javascript
js获取url中的参数且参数为中文时通过js解码
Mar 19 Javascript
ztree获取当前选中节点子节点id集合的方法
Feb 12 Javascript
JavaScript DSL 流畅接口(使用链式调用)实例
Mar 15 Javascript
JS+DIV实现鼠标划过切换层效果的方法
May 25 Javascript
JavaScript中的函数嵌套使用
Jun 04 Javascript
jQuery简单创建节点的方法
Sep 09 Javascript
扩展jquery easyui tree的搜索树节点方法(推荐)
Oct 28 Javascript
jQuery生成假加载动画效果
Dec 01 Javascript
Jqprint实现页面打印
Jan 06 Javascript
超简单的Vue.js环境搭建教程
Mar 17 Javascript
JS sort方法基于数组对象属性值排序
Jul 10 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代码的53条建议
2008/03/27 PHP
PHP怎么实现网站保存快捷方式方便用户随时浏览
2013/08/15 PHP
PHP SPL标准库之SplFixedArray使用实例
2015/05/12 PHP
解决tp5在nginx下修改配置访问的问题
2019/10/16 PHP
Firefox getBoxObjectFor getBoundingClientRect联系
2008/10/26 Javascript
手机端网页点击链接触发自动拨打或保存电话的示例代码
2014/08/15 Javascript
javascript实现五星评分功能
2015/11/10 Javascript
老生常谈JavaScript中的this关键字
2016/10/01 Javascript
微信小程序页面跳转功能之从列表的item项跳转到下一个页面的方法
2017/11/27 Javascript
vue-cli 3.x 修改dist路径的方法
2018/09/19 Javascript
JS使用JSON.parse(),JSON.stringify()实现对对象的深拷贝功能分析
2019/03/06 Javascript
javascript验证form表单数据的案例详解
2019/03/25 Javascript
微信小程序select下拉框实现效果
2019/05/15 Javascript
Layui数据表格 前后端json数据接收的方法
2019/09/19 Javascript
vue实现一个6个输入框的验证码输入组件功能的实例代码
2020/06/29 Javascript
用python结合jieba和wordcloud实现词云效果
2017/09/05 Python
python实现图书借阅系统
2019/02/20 Python
如何用Python制作微信好友个性签名词云图
2019/06/28 Python
在django中实现页面倒数几秒后自动跳转的例子
2019/08/16 Python
django自带serializers序列化返回指定字段的方法
2019/08/21 Python
分享30个新鲜的CSS3打造的精美绚丽效果(附演示下载)
2012/12/28 HTML / CSS
Champion官网:美国冠军运动服装
2017/01/25 全球购物
EJB的激活机制
2013/10/25 面试题
Math.round(11.5)等於多少? Math.round(-11.5)等於多少?
2015/01/27 面试题
求职简历中的自我评价分享
2013/12/08 职场文书
施工工地安全标语
2014/06/07 职场文书
银行金融服务方案
2014/06/11 职场文书
安全目标管理责任书
2014/07/25 职场文书
2014第二批党员干部对照“四风”找差距检查材料思想汇报
2014/09/18 职场文书
项目负责人岗位职责
2015/02/15 职场文书
2015年新农村建设工作总结
2015/05/22 职场文书
银行工作心得体会范文
2016/01/23 职场文书
Python还能这么玩之用Python做个小游戏的外挂
2021/06/04 Python
python接口测试返回数据为字典取值方式
2022/02/12 Python
Minikube搭建Kubernetes集群
2022/03/31 Servers
Dubbo+zookeeper搭配分布式服务的过程详解
2022/04/03 Java/Android