130

我很难弄清楚这一点。我有两个复选框(将来会有更多):

  • checkSurfaceEnvironment-1
  • checkSurfaceEnvironment-2

基本上,我想编写一个 if 语句并测试其中一个是否被检查而另一个未被检查。完成以下任务的最简单方法是什么:

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

18 回答 18

240

我使用的一种可靠方法是:

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

如果要迭代检查的元素,请使用父元素

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

更多信息:

这很有效,因为所有复选框都有一个已选中的属性,该属性存储了复选框的实际状态。如果您希望可以检查页面并尝试选中和取消选中复选框,您会注意到属性“已选中”(如果存在)将保持不变。该属性仅代表复选框的初始状态,而不是当前状态。当前状态存储在该复选框的 dom 元素的属性中。

请参阅HTML 中的属性和属性

于 2012-07-11T19:39:47.160 回答
86
if (!$("#checkSurfaceEnvironment-1").is(":checked")) {
    // do something if the checkbox is NOT checked
}
于 2012-11-08T07:11:16.777 回答
32

您还可以使用 jQuery.not()方法或:not()选择器:

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

JSFiddle 示例


补充说明

:not() 来自选择器的 jQuery API 文档:

.not () 方法最终将为您提供比将复杂的选择器或变量推入:not() 选择器过滤器更易读的选择。在大多数情况下,这是一个更好的选择。

于 2013-09-26T16:18:49.987 回答
22

另一种方法:

这是一个工作示例,这是代码,您还应该使用 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");
    }
});​

我注释掉了切换选中属性的方法。

于 2012-07-11T19:43:43.420 回答
13

我认为检查复选框是否选中的最简单方法(使用 jQuery)是:

如果“检查”:

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

如果没有“检查”:

if (!$(this).is(':checked')) {
// I'm NOT checked let's do something
}
于 2019-01-11T13:24:25.447 回答
11
if ( $("#checkSurfaceEnvironment-1").is(":checked") && $("#checkSurfaceEnvironment-2").not(":checked") )
于 2012-07-11T19:42:15.300 回答
6

我正在寻找像avijendr建议的更直接的实现。

我对他/她的语法有点麻烦,但我得到了这个工作:

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

就我而言,我有一个带有 class 的表user-forms,我正在检查是否有任何包含字符串的复选框checkPrint未被id选中。

于 2014-03-12T14:13:11.430 回答
4

在这里,我有一个关于这个问题的片段。

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

于 2015-08-17T10:43:18.113 回答
3

像你一样做.attr(),看看它是否被检查过.attr("checked", "checked"),如果不是,它会是.attr("checked") == undefined

于 2012-07-11T19:40:23.927 回答
1

如果在 div 中选中所有复选框,则返回 true

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;
}
于 2014-03-12T14:26:25.927 回答
1

简单且易于检查或未检查的条件

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

<script>
    $( "#ev-click" ).click(function() {
        if(this.checked){
            alert('checked');
        }
        if(!this.checked){
            alert('Unchecked');
        }
    });
</script>
于 2017-01-02T07:18:39.663 回答
1

试试这个

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

在上面的代码中,通过 Id 选择元素,(#checkSurfaceEnvironment-1)然后通过过滤器过滤掉它的检查状态(:checked)

它将返回已检查元素对象的数组。如果数组中存在任何对象,则满足条件。

于 2016-02-25T07:16:05.693 回答
1

有两种方法可以检查条件。

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
}

我希望这对你有用。

于 2017-11-30T04:35:13.270 回答
1

这是给出的最简单的方法

 <script type="text/javascript">

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

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

                }

            });

        });

    </script>
于 2018-01-04T04:45:01.210 回答
0

我用过这个并为我工作!

$("checkbox selector").click(function() {
    if($(this).prop('checked')==true){
       do what you need!
    }
});
于 2016-07-25T05:01:59.547 回答
0

我知道这已经得到了回答,但是,这是一个很好的方法:

if ($("#checkbox").is(":checked")==false) {
    //Do stuff here like: $(".span").html("<span>Lorem</span>");
}
于 2018-04-03T21:39:54.477 回答
0
if($("#checkbox1").prop('checked') == false){
    alert('checkbox is not checked');
    //do something
}
else
{ 
    alert('checkbox is checked');
}
于 2018-11-12T07:42:17.850 回答
-4
$("#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
    }

});
于 2018-06-05T13:16:24.840 回答