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

发布于 2025-01-08 16:24:32 字数 1320 浏览 0 评论 0原文

在我的表单上,有两个复选框,即“主”和“从”。每当检查主设备时,都需要检查从设备(尽管可以通过单独单击从设备来取消检查)。在表单加载上 - 主站设置为检查(默认值),这意味着从站也需要检查。

然后,我有一些 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>

请告知。非常感谢任何帮助。

On a form I have, there are two checkboxes, say Master and Slave. Whenever the master is checked, the slave needs to be checked (although slave could be unchecked by individually clicking on it). On the form load - the Master is set to check (default value) which means the slave also needs to be checked.

Then, I have some onChange event handler that manually checks and unchecks the slave based on the state of the master. This is where it doesn't work , just in IE. It works fine in other browsers. I have no idea why this is happening.

I am using jQuery and some css class that merely toggles between checked image and unchecked image. This is an issue only with the checkbox CSS (visual / graphic). The value is still true for that checkbox.

Here is the code

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);
}
}

The HTML is pretty basic. Adding as per requests in the comment

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

Please advise. Any help much appreciated.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

楠木可依 2025-01-15 16:24:32

试试这个:

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

Try this:

  $("#Button1").click(function() {
               if ($('#Checkbox1').attr('checked')) {
                   Checkbox1.checked = false;
               }
               else {
                   Checkbox1.checked = true;
               }
           });
弄潮 2025-01-15 16:24:32

其实还有更简单的方法,只需将复选框 checked 属性更改为 truefalse 即可:

checkbox.on('click', toggleCheckbox);

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

There's actually an even simpler way, you just need to change the checkbox checked proprerty to true or false:

checkbox.on('click', toggleCheckbox);

function toggleCheckbox() { 
    if(checkbox[0].checked) checkbox[0].checked = false;
    else checkbox[0].checked = true;
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文