Question

我正在使用带有'id'的规则，因为它为我提供了更大的灵活性，可以将其连接到django项目，主要问题是模型的字段名称是'name'（name =“name”） - 这似乎是JavaScript中的保留字。

根据文档看起来我想做的事情是可能的，而且我几乎使用了这里给出的确切示例： http://jqueryvalidation.org/rules/?rdfrom=http%3A%2F%2Fdocs.jquery.com%2Fmw%2Findex.php%3Ftitle%3DPlugins%2FValidation%2Frules%26redirect%3Dno#.22add.22rules

问题是我没有收回任何指定的自定义错误消息，而是我猜测正在返回默认值。即。如果没有输入任何内容，我将收到默认错误消息：

“此字段是必填字段”

与我的自定义讯息相反：

“必填项”

如果我输入1个字符，我会得到：

“请输入至少2个字符”

与我的自定义讯息相反：

“请，至少需要{0}个字符”

我正在运行Ubuntu 12.04，我在Firefox和Chrome中都看到了相同的行为。

对于JQuery来说，我几乎是一个新手，所以我希望我从文档中复制和粘贴一个明显的问题，我忽略了......任何建议都会受到赞赏。

我在下面提供了我的代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Language" content="en-us" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>jQuery Example 3</title>

    <script type="text/javascript" language="javascript" src="Scripts/jquery-1.2.6.js"></script>
    <script type="text/javascript" language="javascript" src="Scripts/jquery.validate.js"></script>
    <script type="text/javascript" language="javascript">
        //Our validation script will go here.
        $(document).ready(function(){
            // Set up validation based around the id.
            $("#form1").validate();

            $( "#fname1" ).rules( "add", {
                required: true,
                minlength: 2,
                messages: {
                    required: "Required input",
                    minlength: jQuery.format("Please, at least {0} characters are necessary")
                }
            });

            $("#lname1").rules("add", {
                required: true
            });
        });
    </script>

    <style type="text/css">
    #container {
        width: 350px;
        height: 8em;
        border: 1px #009933 solid;
        background-color:#66FF66;
        display:block;
    }

    label, input{
        margin:2px 0px 1px 4px;
    }

    label {
        margin-top:3px;
        font-family:"Times New Roman", Times, serif;
        font-size:1.1em;
    }
    </style>
</head>

<body>
<div id="container">
    <form id="form1">
        <label for="fname1">First Name: </label><br />
        <input name="txtFirstName" type="text" id="fname1" /><br />
        <label for="lname1">Last Name:</label><br />
        <input name="txtLastName" type="text" id="lname1" title="Please Enter a Last Name"/><br />
        <input type="submit" value="Submit" id="btnSubmit"  />  
    </form>
</div>
</body>
</html>

Answer 1

你的代码工作正常我已经测试过了，mabye第二条消息让你有点困惑：

如果我输入1个字符，我会得到：

“请输入至少2个字符”

与我的自定义讯息相反：

“请，至少需要{0}个字符”

{0}只是一个占位符，它会充满minlength的值，因此您可以获得自定义消息。

我已经复制/粘贴了您的代码并对其进行了测试而没有更改任何内容，它似乎工作正常：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Language" content="en-us" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>jQuery Example 3</title>

    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script type="text/javascript" language="javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.js"></script>
    <script type="text/javascript" language="javascript">
        //Our validation script will go here.
        $(document).ready(function(){
            // Set up validation based around the id.
            $("#form1").validate();

            $( "#fname1" ).rules( "add", {
                required: true,
                minlength: 5,// changed it to 5 just to test the placeholder 
                messages: {
                    required: "You custom message ",
                    minlength: jQuery.format("Please, at least {0} characters are necessary")
                }
            });

            $("#lname1").rules("add", {
                required: true
            });
        });
    </script>

    <style type="text/css">
    #container {
        width: 350px;
        height: 8em;
        border: 1px #009933 solid;
        background-color:#66FF66;
        display:block;
    }

    label, input{
        margin:2px 0px 1px 4px;
    }

    label {
        margin-top:3px;
        font-family:"Times New Roman", Times, serif;
        font-size:1.1em;
    }
    </style>
</head>

<body>
<div id="container">
    <form id="form1">
        <label for="fname1">First Name: </label><br />
        <input name="txtFirstName" type="text" id="fname1" /><br />
        <label for="lname1">Last Name:</label><br />
        <input name="txtLastName" type="text" id="lname1" title="Please Enter a Last Name"/><br />
        <input type="submit" value="Submit" id="btnSubmit"  />  
    </form>
</div>
</body>
</html>

使用.rules（）进行JQuery验证自定义消息问题

1 个答案: