Question

以下是我的HTML的一部分：

<div class="editor-field">
    <input id="ImmobilizationLength_1" name="ImmobilizationLength" type="text" value="">
</div>
....
*HTML Code*
....
<div class="editor-field">
    <input id="ImmobilizationLength_2" name="ImmobilizationLength" type="text" value="">
</div>

当我想用jQuery验证这些字段时，我添加了规则：

ImmobilizationLength: { required: true, digits: true }

提交表单时，只会验证第一个ImmobilizationLength字段。

我在stackoverflow上读到了另一个关于它的问题，建议使用：

$('[name="ImmobilizationLength"]').each(function(){
    $(this).rules("add", { required: true, digits: true } );   
});

但是，当我这样做时，我收到了这个错误：

TypeError：无法读取未定义的属性“nodeName”

我该怎么办？

Answer 1

你不能拥有相同id选择器的项目将无法正常工作如果它们在发布数据时具有相同的名称也不正确。除非你使用namearray

喜欢

 name="ImmobilizationLength[]"

例如

<div class="editor-field">
    <input id="input_1"  name="input_1" class="test" type="text" value="">
</div>

根据评论，一旦您更改了ID，就可以使用带选择器的

开头

 $('[id^="input_"]').each(...
....
*HTML Code*
....
<div class="editor-field">
       <input id="input_2"  name="input_2" class="test" type="text" value="">
</div>

我会给他们一个基于班级名称

的班级和规则

$.validator.addClassRules({
       test: {
           digits: true,
           required: true
       }
});

Answer 2

根据W3Schools，ID必须是唯一的：

“id属性指定HTML元素的唯一ID。在HTML文档中，id必须是唯一的。”

http://www.w3schools.com/tags/att_standard_id.asp

由于标记无效，您的Javascript无法按预期工作。更正标记后（通过创建唯一ID，并可选择添加类），您可以轻松验证您的唯一字段。

请注意，与ID不同，可以重复上课。不应重复使用名称，因为如果提交表单，每个字段的值将相互覆盖。

编辑：

重复的名称仍然是个问题。如果要使用each（），则需要使用可以复制的标识符，例如class。

$('[name="ImmobilizationLength"]').each(function(){ 
});

将成为

$('.test').each(function(){
});

Answer 3

以下是我解决类似问题的方法。虽然我没有验证，而是动态设置值。但是可以应用相同的基本逻辑：

function validateFieldValues( fields )
{
    if ( 'length' in fields ) 
    {
        // We got a collection of form fields
        for ( var x = 0; x < fields.length; x++ ) {
            doValidation( fields[x].value );
        }
    }
    else
    {
        // We got a single form field
        doValidation( fields.value );
    }
}

function submitHandler( oForm )
{
    // Get the element collection of <input> elements with the same name
    var someNameElmts = oForm.elements.someName;

    // *should* always exist.  But just in case...
    if ( someNameElmts ) {
        validateFieldValues( someNameElmts );
    } else {
        // deal with it
    }
}

在HTML中：

<form 
method="post" 
name="someForm" 
id="someFormID" 
action="/some/path" 
onsubmit="submitHandler(this);">

希望有所帮助！

验证具有相同名称的多个字段

3 个答案: