Question

我是js和jquery库的初学者。我想获得一个具有特定名称的输入字段数组，并验证输入。我的每个输入字段都有一个名称，如NS [0]，NS [1]等。字段总数必须由代码确定，因为字段是由javascript生成的。

我知道我可以让jquery像这样解决单个对象：

$("input[name=NS\\[0\\]]").val() <input type="text" name="NS[0]">。

但是，如何从NS [0]到NS [x]获得所有这些类似元素的数组，其中x必须根据生成的字段数来确定？我已经有其他具有不同名称模式的字段共享相同的css类，因此使用class不是一个选项。这些框位于特定的div区域，但在同一区域中是其他输入字段，因此选择同一区域的所有输入框也会选择它们。

换句话说，在获取整个输入字段数组后，如何使用jquery检查每个输入字段的名称，以检查每个单独的名称？

由于我在表ID CNTR1确定的区域中输入了各种名称的字段，因此我会用$('#CNTR1 input')选择它们。我也可以使用$("input[name=]")选择单个字段。但是，我想要做的是选择$('#CNTR1 input')下的所有内容，然后对其名称运行循环，检查名称是否符合预定条件。我怎么能这样做？

html代码：

<table class="table" id="cnservers">
<thead>
      <tr>
        <th>Type</th>
        <th>Preference</th> 
        <th>Value</th> 
        <th>Name</th> 
      </tr>
    </thead>
    <tr id="CNTR0"> 
    <td>CNAME</td><td><input type="text" name="CN_PREF[0]" value=""></td><td>
    <input type="text" name="CN_VAL[0]" value=""></td><td>
    <input type="text" name="CN_NAME[0]" value="">  
    <a class="btn btn-danger" onclick="DelField(this.id);" id="CN_D0" >
        <span class="btn-label">Delete  
    </span>
    </a>            
    <a class="btn btn-primary" onclick="addField('cnservers','CN',10);" id="CN_A0" >
        <span class="btn-label">Add     
    </span>     

    </td></tr>      
</table>

[1]: http://i.stack.imgur.com/bm0Jq.jpg

Answer 1

试试这个

HTML

<table id="CNTR1">
  <tr>
   <td>CNAME</td>
   <td><input type="text" name="CN_PREF[1]" id="CN_IN[1]"></td>
   <td><input type="text" name="CN_VAL[1]"></td>
   <td><input type="text" name="CN_NAME[1]"></td>
  </tr>
</table>

JS

$(document).ready(function(){
   $("#CNTR1 input").each(function() { 
      console.log($(this).attr("name"));
      // Match With predetermined criteria      
   });

}）;

Answer 2

我一定错过了什么。有没有理由你不能使用http://api.jquery.com/attribute-starts-with-selector/？

$('#CNTR1').find('input[name^="NS"]')

关于，

但是，我想要做的是选择$（'＃CNTR1 input'）下的所有内容，然后对其名称运行循环，检查名称是否符合预定条件。我怎么能这样做？

$("#CNTR1 input").each(function(index, elem) { 
    var $elem = $(elem),
        name = $elem.attr('name');

    var nameMatchesCondition = true; // replace with your condition 
    if (nameMatchesCondition) {
        // do something!
    }   
});

编辑1：

好吧，id仍然是html元素的属性。所以你可以做$('[id^="CNTR1"]') ...元素的id属性的值不包含#。它只是css / jquery选择器的一部分。使用属性样式选择器时，您不需要它。虽然我不能评论这个的表现。

理想情况下，您希望附加第二个类，将js-cntr添加到您使用id创建的所有元素，以CNTR开头。尽管不同的名称模式元素可能已经有一个类，但该类用于样式化。无法阻止您纯粹通过js选择自定义类。这是一个可接受的事情，这就是为什么类名称以js-开头，表示它纯粹是通过js用于选择。

Answer 3

使用jQuery的.filter方法，带有过滤功能：

filterCritera = /^CN_NAME\[/; // or whatever your criteria is

var inputs = $('#CNTR0 input');

// you could also cache this filter in a variable
inputs.filter(function(index){
    return filterCritera.test(this.name);
}).css('background','red');

jsbin

您发布的标记不是您问题中描述的标记（它不包含NS[0]），但您可以在上面的reguluar表达式中替换它。

检查jquery选择的对象数组中元素的名称

3 个答案: