Ответ 1
$('.theClass:checkbox:checked')
предоставит вам все отмеченные флажки с классом theClass
.
Я знаю, что могу установить все флажки на странице, используя это:
$('input[type=checkbox]').each(function () {
var sThisVal = (this.checked ? $(this).val() : "");
});
Но теперь я использую это на странице с некоторыми другими флажками, которые я не хочу включать. Как я могу изменить вышеприведенный код, чтобы посмотреть только флажки с флажками, на которых есть определенный класс?
$('.theClass:checkbox:checked')
предоставит вам все отмеченные флажки с классом theClass
.
$('input:checkbox.class').each(function () {
var sThisVal = (this.checked ? $(this).val() : "");
});
Пример для демонстрации.
:checkbox
- это селектор для флажков (на самом деле вы можете опустить часть input
селектора, хотя я нашел случаи ниши, где вы получите странные результаты, сделанные в более ранних версиях библиотеки. уверен, что они исправлены в более поздних версиях).
.class
- это селектор для атрибута класса элемента, содержащий class
.
Обязательный .map
пример:
var checkedVals = $('.theClass:checkbox:checked').map(function() {
return this.value;
}).get();
alert(checkedVals.join(","));
$('input.yourClass:checkbox:checked').each(function () {
var sThisVal = $(this).val();
});
Это позволит получить все флажки имени класса "yourClass". Мне нравится этот пример, потому что он использует селектор jQuery, а не выполняет условную проверку. Лично я бы также использовал массив для хранения значения, а затем использовал их по мере необходимости, например:
var arr = [];
$('input.yourClass:checkbox:checked').each(function () {
arr.push($(this).val());
});
Если вам нужно получить значение всех отмеченных флажков в виде массива:
let myArray = (function() {
let a = [];
$(".checkboxes:checked").each(function() {
a.push(this.value);
});
return a;
})()
$('input.myclass[type=checkbox]').each(function () {
var sThisVal = (this.checked ? $(this).val() : ""); });
Смотрите селекторы класса jQuery.
Я не уверен, помогает ли это вашему конкретному делу, и я не уверен, что в вашем случае флажки, которые вы хотите включить, являются частью одной формы или 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() : "");
});
Простой способ получить все значения в массив
var valores = (function () {
var valor = [];
$('input.className[type=checkbox]').each(function () {
if (this.checked)
valor.push($(this).val());
});
return valor;
})();
console.log(valores);
<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>
Я знаю, что у этого есть куча замечательных ответов на этот вопрос, но я нашел это во время просмотра, и я считаю его очень простым в использовании. Думал, что я поделюсь тем, кто еще смотрит.
HTML:
<fieldset>
<!-- these will be affected by check all -->
<div><input type="checkbox" class="checkall"> Check all</div>
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
</fieldset>
<fieldset>
<!-- these won't be affected by check all; different field set -->
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
</fieldset>
JQuery
$(function () {
$('.checkall').on('click', function () {
$(this).closest('fieldset').find(':checkbox').prop('checked', this.checked);
});
});
Вы можете использовать что-то вроде этого:
HTML:
<div><input class="yourClass" type="checkbox" value="1" checked></div>
<div><input class="yourClass" type="checkbox" value="2"></div>
<div><input class="yourClass" type="checkbox" value="3" checked></div>
<div><input class="yourClass" type="checkbox" value="4"></div>
JQuery:
$(".yourClass:checkbox").filter(":checked")
Он выберет значения 1 и 3.
$("html").find('input[name="checked-box"]').each(function () {
if($(this).is(":checked")){
$(this).parents(".block").remove();
}
});