微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jQuery表单验证按钮点击

我有一个简单的页面一个窗体和一个按钮外面的窗体。我试图验证表单上的按钮点击。
我已经在document.onready函数添加了表单验证的规则。但是窗体没有得到验证。

HTML: –

<html>
<head>
   <script src="lib/jquery1.5.2.js"></script>
   <script src="lib/jquery.validate.js"></script>
   <script src="lib/myjs.js"></script>
</head>
<body>

<form id="form1" name="form1"> 
     Field 1: <input id="field1" type="text" class="required">
</form>

<div>
    <input id="btn" type="button" value="Validate">
</div>

</body>
</html>

JS: –

$(document).ready(function(){

$("#form1").validate({
   rules: {
     field1: "required"
   },messages: {
     field1: "Please specify your name"

   }
})

$('#btn').click(function() {
 $("#form1").validate();  // This is not working and is not validating the form
});

});

任何想法有什么问题?

解决方法

在你的点击处理程序中,错误是.validate()方法;它只初始化插件,它不验证窗体。

要消除在表单中提交按钮的需要,请使用.valid()触发验证检查…

$('#btn').on('click',function() {
    $("#form1").valid();
});

jsFiddle Demo

.validate() – 初始化插件(使用选项)一次在DOM就绪。

.valid() – 检查验证状态(布尔值)或在表单上随时触发验证测试。

否则,如果在表单容器中有一个type =“submit”按钮,则不需要特殊的点击处理程序和.valid()方法,因为插件自动捕获。

Demo without click handler

编辑:

您的HTML中还有两个问题…

<input id="field1" type="text" class="required">

>在.validate()中声明规则时,不需要class =“required”。它是多余的和多余的。
>缺少name属性。规则通过其名称在.validate()中声明。插件依赖于唯一的名称属性来跟踪输入。

应该…

<input name="field1" id="field1" type="text" />

原文地址:https://www.jb51.cc/jquery/184034.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐