jquery - jQuery 验证和自定义 id

Question

我正在使用 jquery validate，当我像这样进行验证时

$("#form").validate({
            // errorLabelContainer: $("div#error"),
            errorElement: "p",
            errorClass: "form-error",
            rules: {
                name: {
                    required: true,
                    minlength: 5
                }
            }
});

一切正常，但如果我有这样的 div id “x.child.1.0.t”，我必须使用这样的东西

$("#form").validate({
            // errorLabelContainer: $("div#error"),
            errorElement: "p",
            errorClass: "form-error",
            rules: {
                x.child.1.0.t: {
                    required: true,
                    minlength: 5
                }
            }
});

这不起作用，怎么办？

Answer 1

把它放在"or里面'，就像 a 一样string，别忘了使用nameattr。

$("#form").validate({
            // errorLabelContainer: $("div#error"),
            errorElement: "p",
            errorClass: "form-error",
            rules: {
                'x.child.1.0.t': {
                    required: true,
                    minlength: 5
                }
            }
});

A validation rule associates an element with a validation method, like "validate input with name "primary-mail" with methods "required" and "email".
参考

 具有复杂名称的字段（括号、点）

If your form consists of fields using names that aren't legal JavaScript identifiers, you have to quote those names when using the rules option: 
参考

Answer 2

...但是如果我有这样的 div id x.child.1.0.t... 不工作...

你必须做两件事...

• 使用name你的属性input，而不是id. 默认情况下，.validate()插件正在寻找's的name属性，而不是它们的. 请参阅项目下的文档。inputidrules:

• 将名称放在.validate()选项中的引号内。 请参阅有关复杂命名的文档。

HTML：

<input name="x.child.1.0.t" />

jQuery：

$("form").validate({
    // errorLabelContainer: $("div#error"),
    errorElement: "p",
    errorClass: "form-error",
    rules: {
        'x.child.1.0.t': {
            required: true,
            minlength: 5
        }
    }
});​

jsFiddle 演示

Answer 3

如果你想验证id而不是name你必须做这样的事情：

$("form").validate({
    errorElement: "p",
    errorClass: "form-error"
});

// This part is ugly because of your strange id
$("#x\\.child\\.1\\.0\\.t").rules("add", {
    required: true,
    minlength: 5
});​

演示：http: //jsfiddle.net/eyKW9/3/

反斜杠的原因是你必须转义.字符，否则 jQuery/Sizzle 认为它是一个类选择器。

一般来说，最好避免使用id这样的值，因为您会遇到 javascript 和 css 的问题。如果可能，坚持使用字母破折号和下划线。