0

我在现有表单上使用 jquery 验证插件，但它没有在提交时触发。

我在浏览器中没有收到任何 javascript 错误，但什么也没发生，并且表单正在提交，这是不应该的。

这是代码：

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>   
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js></script>
<script type="text/javascript">

$().ready(function () {
    // validate the comment form when it is submitted
    $("#registrationform").validate();

    // validate signup form on keyup and submit
    $("#registrationform").validate({
        rules: {
            fullname: {
                required: true,
                minlength: 2,
                maxlength: 50
            }

        },
        messages: {
            fullname: {
                required: "Please enter a name",
                minlength: "Your name must consist of at least 2 characters",
                maxlength: "Your name must consist of not more than characters"
            }
        }
    });
});
</script>
</head>

<body>
<form id="registrationform" name="registrationform" method="post" action="pageaftervalidation.html">

<table>
<tr>
  <td>Name:</td>
  <td><input id="fullname" name="fullname" type="text"></td>
</tr>
<tr>
<td colspan="2">
    <input type="Submit" value="Submit">
</td>
</tr>
</table>
</form>
</body>
</html>

为什么它在提交时没有触发任何验证？

发现了问题。

我不能有两个验证功能。从演示中，我尝试在提交和 keyup 时验证表单，但我不需要因为 keyup 验证两者都进行。

所以要解决上述问题，我删除了该行

$("#registrationform").validate();
4

1 回答 1

2

它不起作用，因为第一个实例.validate()优先于任何后续实例。由于在您的第一个实例中没有定义任何选项，因此插件在没有任何规则或选项的情况下被初始化，并且第二个实例被完全忽略。

$("#registrationform").validate();  // <-- delete this line.

$("#registrationform").validate({
    // your rules & options
});

此外，根据 jQuery 文档，不建议这样做...

$().ready(function () {

把它改成更标准的东西......

$(document).ready(function () {

对于更高效的代码，您可以使用该rangelength方法代替minlengthand maxlength。

minlength: 2,
maxlength: 50

可以更简单地写成...

rangelength: [2,50]
于 2013-06-22T18:59:44.417 回答