如何在 Internet Explorer 中使用 jQuery 切换复选框状态
在我的表单上,有两个复选框,即“主”和“从”。每当检查主设备时,都需要检查从设备(尽管可以通过单独单击从设备来取消检查)。在表单加载上 - 主站设置为检查(默认值),这意味着从站也需要检查。
然后,我有一些 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 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
试试这个:
Try this:
其实还有更简单的方法,只需将复选框
checked
属性更改为true
或false
即可:There's actually an even simpler way, you just need to change the checkbox
checked
proprerty totrue
orfalse
: