jQuery: проверьте, не установлен ли флажок
у меня возникли проблемы с выяснением этого. У меня есть два флажка (в будущем будет больше):
checkSurfaceEnvironment-1
checkSurfaceEnvironment-2
В принципе, я хочу написать оператор if и проверить, если один из них проверен, а другой не проверен. Что самый простой способ выполнить следующее:
if ( $("#checkSurfaceEnvironment-1").attr('checked', true) &&
$("#checkSurfaceEnvironment-2").is('**(NOT??)** :checked') ) {
// do something
}
16 ответов:
один надежный способ, который я использую:
if($("#checkSurfaceEnvironment-1").prop('checked') == true){ //do something }
Если вы хотите перебирать проверенные элементы, используйте родительский элемент
$("#parentId").find("checkbox").each(function(){ if ($(this).prop('checked')==true){ //do something } });
Подробнее:
это хорошо работает, потому что все флажки имеют свойство проверяется который хранит фактическое состояние checkbox. Если вы хотите, вы можете проверить страницу и попытаться установить и снять флажок, и вы заметите, что атрибут "проверено" (если присутствует) останется прежним. Этот атрибут представляет только начальное состояние флажка, а не настоящее государство. Текущее состояние хранится в свойстве, отмеченном для элемента dom для этого флажка.
посмотреть свойства и атрибуты в HTML
if (!$("#checkSurfaceEnvironment-1").is(":checked")) { // do something if the checkbox is NOT checked }
вы также можете использовать jQuery в
.not()
способ или:not()
селектор:if ($('#checkSurfaceEnvironment').not(':checked').length) { // do stuff for not selected }
Дополнительная Информация
из документации API jQuery для
:not()
селектор:The .не()метод в конечном итоге предоставит вам более читаемый выбора, чем нажатие сложных селекторов или переменных в :не() селектор фильтр. В большинстве случаев это лучший выбор.
альтернативный способ:
здесь пример работающего и вот код, вы также должны использовать опору.
$('input[type="checkbox"]').mouseenter(function() { if ($(this).is(':checked')) { //$(this).prop('checked',false); alert("is checked"); } else { //$(this).prop('checked',true); alert("not checked"); } });
Я прокомментировал способ переключения проверенного атрибута.
if ( $("#checkSurfaceEnvironment-1").is(":checked") && $("#checkSurfaceEnvironment-2").not(":checked") )
Я искал более прямую реализацию, как предложил avijendr.
у меня были небольшие проблемы с его / ее синтаксисом, но я получил эту работу:
if ($('.user-forms input[id*="chkPrint"]:not(:checked)').length > 0)
в моем случае, у меня была таблица с Класс
user-forms
, и я проверял, если любой из флажков, которые имели строкуcheckPrint
в своемid
был снят.
сделать это с
.attr()
как у вас есть, чтобы увидеть, если он проверил это будет.attr("checked", "checked")
, а если бы не было, то было бы.attr("checked") == undefined
вот у меня есть фрагмент для этого вопроса.
$(function(){ $("#buttoncheck").click(function(){ if($('[type="checkbox"]').is(":checked")){ $('.checkboxStatus').html("Congratulations! "+$('[type="checkbox"]:checked').length+" checkbox checked"); }else{ $('.checkboxStatus').html("Sorry! Checkbox is not checked"); } return false; }) });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form> <p> <label> <input type="checkbox" name="CheckboxGroup1" value="checkbox" id="CheckboxGroup1_0"> Checkbox</label> <br> <label> <input type="checkbox" name="CheckboxGroup1_" value="checkbox" id="CheckboxGroup1_1"> Checkbox</label> <br> </p> <p> <input type="reset" value="Reset"> <input type="submit" id="buttoncheck" value="Check"> </p> <p class="checkboxStatus"></p> </form>
возвращает true, если все checbox проверяются в div
function all_checked (id_div){ all_checked = true; $(id_div+' input[type="checkbox"]').each(function() { all_checked = all_checked && $('this').prop('checked'); } return all_checked; }
простой и легкий для проверки или непроверенного состояния
<input type="checkbox" id="ev-click" name="" value="" > <script> $( "#ev-click" ).click(function() { if(this.checked){ alert('checked'); } if(!this.checked){ alert('Unchecked'); } }); </script>
попробуй этот
if ($("#checkSurfaceEnvironment-1:checked").length>0) { //your code in case of NOT checked }
В приведенном выше коде выбор элемента по Id
(#checkSurfaceEnvironment-1)
затем отфильтровать это проверенное состояние с помощью(:checked)
фильтр.он вернет массив проверенного объекта элемента. Если в массиве существует какой-либо объект, то условие if будет выполнено.
есть два способа проверить состояние.
if ($("#checkSurfaceEnvironment-1").is(":checked")) { // Put your code here if checkbox is checked }
или вы можете использовать этот
if($("#checkSurfaceEnvironment-1").prop('checked') == true){ // Put your code here if checkbox is checked }
Я надеюсь, что это полезно для вас.
я использовал это и в работает для меня!
$("checkbox selector").click(function() { if($(this).prop('checked')==true){ do what you need! } });
вот самый простой способ дано
<script type="text/javascript"> $(document).ready(function () { $("#chk_selall").change("click", function () { if (this.checked) { //do something } if (!this.checked) { //do something } }); }); </script>
Я знаю, что на это уже ответили, но все же, это хороший способ сделать это:
if ($("#checkbox").is(":checked")==false) { //Do stuff here like: $(".span").html("<span>Lorem</span>"); }
$("#chkFruits_0,#chkFruits_1,#chkFruits_2,#chkFruits_3,#chkFruits_4").change(function () { var item = $("#chkFruits_0,#chkFruits_1,#chkFruits_2,#chkFruits_3,#chkFruits_4"); if (item.is(":checked")==true) { //execute your code here } else if (item.is(":not(:checked)")) { //execute your code here } });