我如何确定是不是选中了复选框以执行某些操作，然后未选中执行其他操作？ [复制]

Posted 2023-03-05

【中文标题】我如何确定是不是选中了复选框以执行某些操作，然后未选中执行其他操作？ [复制]

【英文标题】：How do I determine if a checkbox is checked to do something, then unchecked do something else? [duplicate]我如何确定是否选中了复选框以执行某些操作，然后未选中执行其他操作？ [复制]

【发布时间】：2020-06-05 10:38:38

【问题描述】：

我有一个 php 数组，它在表单中填充复选框的 ID，然后使用 jQuery 来捕获这些 ID。现在我很难写一个 If/Else 语句来确定复选框是否被选中，如果是，做一件事，如果它没有被选中，做别的事情。此代码在 If 语句之外工作，但只要我添加任何不同的方法来确定它是否被检查，它就会停止工作。

我使用的不同方法是：.click、.is(':checked')、.prop 和 (this.checked)，但没有任何效果。

这个（和.change）有效：

$('#' + product_array[i]).click(function()

     alert(product_array[i]);

);

这（以及上面提到的所有其他方法）不会：

$('#' + product_array[i]).click(function()

    if(this.checked)
        alert('checked');
    
    else 
        alert('unchecked');
    
);

【问题讨论】：

if(this.checked==true)else

我刚刚尝试过，它确实有效，但有点倒退。当我选中该框时，会触发“else”语句。当我去掉 else 语句时，它不起作用。

***.com/help/minimal-reproducible-example

【参考方案1】：

解决方案 1

$("input[type='checkbox']").on("change", function()
   if($(this).prop('checked'))
    console.log("Checked");
   else
    console.log("UnCheck"); 
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" />

解决方案 2

您可以使用该类来收听您的复选框change 事件，如下所示。

$(".myCheckBox").on("change", function()
   if($(this).prop('checked'))
    console.log("Id: " + $(this).attr("id") + " Checked");
   else
    console.log("Id: " + $(this).attr("id") + " UnChecked");
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input class="myCheckBox" type="checkbox" id="1" />
<input class="myCheckBox" type="checkbox" id="2" />
<input class="myCheckBox" type="checkbox" id="3"/>

【讨论】：

由于我从 PHP 数组中填充 ID，如何使用我可以用于此的 jquery 数组填充类和 id？

在每个 input 项目中添加您的课程。

在您的第一个解决方案中，它可以工作，除了我如何更改： $("input[type='checkbox'"].on('change', function.......能够使用：$("#" + product_array)......？当我尝试它时，只有“else”语句有效，只有“Uncheck”出来。

把你的 html 和 product_array 也给我。请。

【参考方案2】：

$("#checkb").change(function()
$res=$(this).prop('checked')?'do something on check':'do on unchecked'
  console.log($res);
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Check: <input type="checkbox" id='checkb' />

【参考方案3】：

Checked 属性是一个布尔属性。因此，this.checked 将输出真或假。 true-checked 和 false-unchecked。

//$("input[type='checkbox']").click(function()
$("#one").click(function()
   if(this.checked==true)
   
    console.log("Checked");
    
   else
   
    console.log("UnCheck"); 
    
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" id="one" />

【讨论】：

出于某种原因，无论是否选中，这都只表示“未选中”。