javascript - jQuery:验证规则未按预期工作

标签 javascript jquery validation jquery-plugins

<script type="text/javascript">
    $(document).ready(function () {
        $("#loginForm").validate({
            rules: {
                email: {
                    required: true,
                    minlength: 10
                },
                passwd: {
                    required: true,
                    minlength: 8
                }
            },
            messages: {
                email: {
                    required: "Please enter your email",
                    minlength: "Minlength has to be 10"
                },
                passwd: {
                    required: "Please enter your email",
                    minlength: "Minlength has to be 8"
                }
            },
            submitHandler: function (form) {
                alert('valid form submit');
            }
        });
    })
</script>

我在 HTML head 中有这个_

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/jquery.validate.min.js"></script>

上面的 jQuery 位于关闭 body 标记之前的末尾。

当我使用 http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js 时,以下代码在 jsfiddle 上运行得非常好和 http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/jquery.validate.min.js .

但在我的浏览器上,它总是转到提交处理程序。 http://jsfiddle.net/4937t/

非常感谢您的宝贵时间。

最佳答案

我不确定您是如何将脚本包含在 html 文档中的,但让我向您展示工作示例。它适用于我的 chrome。我猜你的脚本位置放错了。希望这有效

<!doctype html>
<html>
<body>
   <form id="loginForm">
     <input name="email" type="text"/><br/>
     <input name="passwd" type="password"/><br/>
     <input type="submit" />
   </form>
   <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
   <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/jquery.validate.min.js"></script>
   <script>
    $(document).ready(function () {
        $("#loginForm").validate({
            rules: {
                email: {
                    required: true,
                    minlength: 10
                },
                passwd: {
                    required: true,
                    minlength: 8
                }
            },
            messages: {
                email: {
                    required: "Please enter your email",
                    minlength: "Minlength has to be 10"
                },
                passwd: {
                    required: "Please enter your password",
                    minlength: "Minlength has to be 8"
                }
            },

            submitHandler: function (form) {
                alert('valid form submit');
            }
        });
    });
  </script>
  </body>
  </html>

关于javascript - jQuery:验证规则未按预期工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23876568/

相关文章:

javascript - 使调用自定义 jQuery 插件变得更容易

javascript - 将 Angular 验证指令与 Breeze 一起使用会阻止任何无效输入

regex - 使用正则表达式验证 HTML5 模式属性中的英国国民保险号/NINO

php - 如何获取 mysql 值作为 jquery 数组值

javascript - 通过 AJAX 发送数据到 MySQL

validation - 接口(interface)转换 : interface {} is nil, not validator.ValidationErrors

javascript - 如何在 Laravel 或其他框架中正确编写表单?

javascript - HTML5 Canvas : Use context. isPointInPath(x, y) 用于具有更多路径的复杂形状

javascript - 带有模板和缓存的客户端 JS 框架?

javascript - 在这种情况下使用 CSS 或 Jquery 有什么区别