Проверка имен элементов из массива объектов, выбранных jquery

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, поэтому использование класса не является вариантом. Эти поля находятся в определенной области div, но в той же области находятся другие поля ввода, поэтому выбор всех полей ввода той же области также выбирает их.

Другими словами, как использовать jquery для проверки имени каждого поля ввода, после получения всего массива полей ввода, для проверки каждого отдельного имени?

Поскольку у меня есть поля ввода различных имен в области, определяемой таблицей id CNTR1, я бы выбрал их с помощью $('#CNTR1 input'). Я также могу выбрать отдельные поля, используя $("input[name=]"). Однако то, что я хочу сделать, - это выбрать все под $('#CNTR1 input'), а затем запустить цикл на их именах, проверяя, соответствуют ли имена заданным критериям. Как я могу это сделать?

HTML-код: .filter метод

<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

Должно быть, что-то не хватает. Есть ли причина, по которой вы не можете использовать http://api.jquery.com/attribute-starts-with-selector/?

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

Что касается,

Однако то, что я хочу сделать, это выбрать все под $ («# CNTR1 вход»), а затем запустить петлю на их имена, проверяя ли имена соответствуют заданным критериям. Как я могу это сделать?

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

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

EDIT 1:

Ну, id по-прежнему является атрибутом элемента HTML. Таким образом, вы можете сделать $('[id^="CNTR1"]') ... Значение атрибута id элемента не содержит #. Это только часть селектора css/jquery. При использовании селекторов стиля атрибутов вам это не нужно. Хотя я не могу прокомментировать это.

В идеале вы хотите присоединить второй класс, скажем js-cntr ко всем элементам, которые вы создали с помощью id, начиная с CNTR. Даже если разные элементы шаблонов имен могут уже иметь один класс, этот класс предназначен для стилизации. Нет необходимости останавливать вас на добавлении пользовательских классов исключительно для выбора через js. Это общепринятая вещь, и именно поэтому имя класса начинается с js-, чтобы обозначить, что его чисто для использования через js для выбора.

Answer 2

Используйте JQuery, в с функцией фильтра:

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 выше.

Answer 3

Попробуйте

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  
    }); 

});