Использование jquery для проверки всех флажков с определенным именем класса



5 Answers

$('input:checkbox.class').each(function () {
       var sThisVal = (this.checked ? $(this).val() : "");
  });

Пример для демонстрации.

:checkbox - это селектор для флажков (на самом деле вы можете опустить input часть селектора, хотя я нашел случаи ниши, в которых вы получите странные результаты, сделанные в более ранних версиях библиотеки. Я уверен, что они исправлены позже версии). .class - это селектор для атрибута class элемента, содержащего class .

Question

Я знаю, что я могу установить все флажки на странице, используя это:

$('input[type=checkbox]').each(function () {
    var sThisVal = (this.checked ? $(this).val() : "");
});

Но теперь я использую это на странице с некоторыми другими флажками, которые я не хочу включать. Как я могу изменить приведенный выше код, чтобы посмотреть только на флажки, отмеченные флажками с определенным классом?




Я не уверен, что это помогает для вашего конкретного случая, и я не уверен, что в вашем случае флажки, которые вы хотите включить, являются частью одной формы или div или таблицы, но вы всегда можете выбрать все флажки внутри определенного элемента. Например:

<ul id="selective">
 <li><input type="checkbox" value="..." /></li>
 <li><input type="checkbox" value="..." /></li>
 <li><input type="checkbox" value="..." /></li>
 <li><input type="checkbox" value="..." /></li>
</ul>

Затем, используя следующий jQuery, он ТОЛЬКО проходит через флажки внутри этого UL с id = "selective":

$('#selective input:checkbox').each(function () {
 var sThisVal = (this.checked ? $(this).val() : "");
});



 $('input.theclass[type=checkbox]').each(function () {
   var sThisVal = (this.checked ? $(this).val() : "");
 });



Вы можете использовать что-то вроде этого:
HTML:

<div><input type="checkbox" value="1" checked></div>
<div><input type="checkbox" value="2"></div>
<div><input type="checkbox" value="3" checked></div>
<div><input type="checkbox" value="4"></div>


JQuery:

$(".yourClass:checkbox").filter(":checked")


Он выберет значения 1 и 3




<input type="checkbox" id="Checkbox1" class = "chk" value = "1" />
<input type="checkbox" id="Checkbox2" class = "chk" value = "2" />
<input type="checkbox" id="Checkbox3" class = "chk" value = "3" />
<input type="checkbox" id="Checkbox4" class = "chk" value = "4" />
<input type="button" id="demo" value = "Demo" />

<script type = "text/javascript" src = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.1.min.js"></script>
<script type="text/javascript">
    $("#demo").live("click", function () {
        $("input:checkbox[class=chk]:checked").each(function () {
            alert("Id: " + $(this).attr("id") + " Value: " + $(this).val());
        });
    });
</script>

http://www.jqueryfaqs.com/Articles/Get-values-of-all-checked-checkboxes-by-class-name-using-jQuery.aspx




$('input.yourClass:checkbox:checked').each(function () {
    var sThisVal = $(this).val();
});

Это позволит получить все флажки имени класса «yourClass». Мне нравится этот пример, потому что он использует селектор jQuery, а не выполняет условную проверку. Лично я бы также использовал массив для хранения значения, а затем использовал их по мере необходимости, например:

var arr = [];
$('input.yourClass:checkbox:checked').each(function () {
    arr.push($(this).val());
});



Related