如何在 Internet Explorer 中使用 jQuery 切换复选框状态答案

【问题标题】：How to toggle checkbox state using jQuery in Internet Explorer如何在 Internet Explorer 中使用 jQuery 切换复选框状态
【发布时间】：2019-05-24 04:28:50
【问题描述】：

在我的表单上，有两个复选框，分别是 Master 和 Slave。每当检查主人时，都需要检查从设备（尽管可以通过单独单击来检查从属）。在表单加载时 - 主站设置为检查（默认值），这意味着从站也需要检查。

然后，我有一些 onChange 事件处理程序，可以根据主设备的状态手动检查和取消选中从设备。这是它不起作用的地方，只是在 IE 中。它在其他浏览器中运行良好。我不知道为什么会这样。

我正在使用 jQuery 和一些仅在选中图像和未选中图像之间切换的 css 类。这仅是复选框 CSS（视觉/图形）的问题。该复选框的值仍然为 true。

这里是代码

dojo.ready(function() { 
    // some code removed for simplicaity sake
$("#militaryOfficial").attr("checked", true);
$("#waiveTax").attr("checked", true);
}
$('#militaryOfficial').click('change', toggleTaxWaive);     
});

function toggleTaxWaive(){
if($("#militaryOfficial").is(':checked'))
{
    if(!$("#waiveTax").is(':checked'))
    {
        $("#waiveTax").trigger("click"); 
    }
}else
{
    $("#waiveTax").attr('checked', false);
}
}

HTML 非常基础。根据评论中的要求添加

<div class="checkBox_Border">
 <span class="cds_spanCheck" style="background: url("/images/checkbox_nonSelect.png")     
 no-repeat scroll 0% 0% transparent;"></span>
 <span class="cds_spanCheck" style="background: url("/images/checkbox_Select.png") no-   
 repeat scroll 0% 0% transparent;"></span>
 <input id="waiveTax" class="checkBox_innerWrap" type="checkbox" checked="checked"   
 value="true" name="waiveTax">
</div>

请指教。非常感谢任何帮助。

【问题讨论】：

或者至少把它贴在小提琴上。
您发布的代码中有几个严重的语法错误：这在任何地方都不起作用。我想这只是一个复制粘贴问题。例如。 addResetButton();需要 "function(){" 而不是 ";"在最后。但是，您可以尝试像这样设置 checked 属性： some_input.prop('checked', 'checked');并像这样取消选中它： some_input.prop('checked', '');适用于所有浏览器。可能是 IE 混淆了 true/false ...
@Nasmon 。谢谢，是的，这些不是真正的错误，我只是手动修改了代码以删除不需要的东西。但是，我尝试了 checked -true 和 check-checked 两种方式，但它对我不起作用。下面提到的 Vinod 的解决方案效果很好。知道为什么..？

标签： jquery internet-explorer checkbox toggle

【解决方案1】：

试试这个：

  $("#Button1").click(function() {
               if ($('#Checkbox1').attr('checked')) {
                   Checkbox1.checked = false;
               }
               else {
                   Checkbox1.checked = true;
               }
           });

【讨论】：

Vinod - 这确实有效！这太棒了，我花了很多时间在这上面。我很好奇 - 是什么让它起作用，除了一些语法之外，这里有什么不同。

【解决方案2】：

其实还有一个更简单的方法，你只需要将复选框checked属性更改为true或false：

checkbox.on('click', toggleCheckbox);

function toggleCheckbox() { 
    if(checkbox[0].checked) checkbox[0].checked = false;
    else checkbox[0].checked = true;
}

【讨论】：