jQuery: проверить, если флажок НЕ установлен

У меня проблемы с выяснением этого. У меня есть два флажка (в будущем будет больше):

  • checkSurfaceEnvironment-1
  • checkSurfaceEnvironment-2

По сути, я хочу написать оператор if и проверить, если один из них проверен, а другой НЕ проверен. Какой самый простой способ сделать следующее:

if ( $("#checkSurfaceEnvironment-1").attr('checked', true) &&
     $("#checkSurfaceEnvironment-2").is('**(NOT??)** :checked') ) {
        // do something
}

Ответ 1

Один из надежных способов использования:

if($("#checkSurfaceEnvironment-1").prop('checked') == true){
    //do something
}

Если вы хотите итерации по отмеченным элементам, используйте родительский элемент

$("#parentId").find("checkbox").each(function(){
    if ($(this).prop('checked')==true){ 
        //do something
    }
});

Дополнительная информация:

Это хорошо работает, потому что у всех флажков проверено свойство, в котором хранится фактическое состояние флажка. Если вы хотите, вы можете проверить страницу и попытаться установить флажок и снять флажок, и вы заметите, что атрибут "checked" (если присутствует) останется таким же. Этот атрибут представляет только начальное состояние флажка, а не текущее состояние. Текущее состояние сохраняется в свойстве, отмеченном элементом dom для этого флажка.

Смотрите Свойства и атрибуты в HTML

Ответ 2

if (!$("#checkSurfaceEnvironment-1").is(":checked")) {
    // do something if the checkbox is NOT checked
}

Ответ 3

Вы также можете использовать метод jQuery .not() или селектор: :not():

if ($('#checkSurfaceEnvironment').not(':checked').length) {
    // do stuff for not selected
}

Пример JSFiddle


Дополнительные примечания

Из документации API jQuery для селектора: :not():

Метод .not() в итоге предоставит вам более читаемые выборки, чем вставка сложных селекторов или переменных в фильтр селекторов : not(). В большинстве случаев это лучший выбор.

Ответ 4

Альтернативный способ:

Вот рабочий пример, и вот код, вы также должны использовать prop.

$('input[type="checkbox"]').mouseenter(function() { 
    if ($(this).is(':checked')) {
        //$(this).prop('checked',false);
        alert("is checked");
    } else {
         //$(this).prop('checked',true);
        alert("not checked");
    }
});​

Я прокомментировал способ переключения проверенного атрибута.

Ответ 5

if ( $("#checkSurfaceEnvironment-1").is(":checked") && $("#checkSurfaceEnvironment-2").not(":checked") )

Ответ 6

Я искал более непосредственную реализацию, такую ​​как avijendr.

У меня была небольшая проблема с его синтаксисом, но я получил это для работы:

if ($('.user-forms input[id*="chkPrint"]:not(:checked)').length > 0)

В моем случае у меня была таблица с классом user-forms, и я проверял, не были ли отмечены какие-либо из флажков с строкой checkPrint в их id.

Ответ 7

Чтобы сделать это с помощью .attr(), как у вас, чтобы проверить, будет ли он отмечен, он будет .attr("checked", "checked"), и если это не так, то .attr("checked") == undefined

Ответ 8

Здесь у меня есть фрагмент для этого вопроса.

$(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>

Ответ 9

Возвращает true, если все чекбоксы отмечены в 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;
}

Ответ 10

попробуйте этот

if ($("#checkSurfaceEnvironment-1:checked").length>0) {
    //your code in case of NOT checked
}

В вышестоящем коде, выбирая элемент Id (#checkSurfaceEnvironment-1), затем отфильтруйте его проверенное состояние с помощью фильтра (:checked).

Он вернет массив объекта элемента checked. Если в массиве есть какой-либо объект, тогда условие будет выполнено.

Ответ 11

Простое и простое или непроверенное условие

<input type="checkbox" id="ev-click" name="" value="" >

<script>
    $( "#ev-click" ).click(function() {
        if(this.checked){
            alert('checked');
        }
        if(!this.checked){
            alert('Unchecked');
        }
    });
</script>

Ответ 12

Есть два способа проверить состояние.

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
}

Я надеюсь, что это будет полезно для вас.

Ответ 13

Вот самый простой способ

 <script type="text/javascript">

        $(document).ready(function () {
            $("#chk_selall").change("click", function () {

                if (this.checked)
                {
                    //do something
                }
                if (!this.checked)
                {
                    //do something

                }

            });

        });

    </script>

Ответ 14

Я использовал это и работал у меня!

$("checkbox selector").click(function() {
    if($(this).prop('checked')==true){
       do what you need!
    }
});

Ответ 15

Я знаю, что на это уже ответили, но все же, это хороший способ сделать это:

if ($("#checkbox").is(":checked")==false) {
    //Do stuff here like: $(".span").html("<span>Lorem</span>");
}

Ответ 16

if($("#checkbox1").prop('checked') == false){
    alert('checkbox is not checked');
    //do something
}
else
{ 
    alert('checkbox is checked');
}

Ответ 17

Я думаю, что самый простой способ (с помощью jQuery) проверить, если флажок установлен или НЕ является:

если 'проверено':

if ($(this).is(':checked')) {
// I'm checked let do something
}

если НЕ "проверено":

if (!$(this).is(':checked')) {
// I'm NOT checked let do something
}

Ответ 18

$("#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
    }

});