当我使用jQuery函数addClass和removeClass更改Internet Explorer(IE)中复选框的外观时,它们无法正常工作。但是,它们在其他浏览器中也可以正常工作。

这是示例代码来说明我的问题:

$('input:#chkbox').click(function()
    {
        //if($(this).is(":checked")){
        if($('input:#chkbox').is(":checked"))
        {
            $('input:#chkbox').next("label").addClass("etykieta_wybrana");
        }
        else
        {
            $('input:#chkbox').next("label").removeClass("etykieta_wybrana");
        }
    });

为了进一步测试,可以使用jsFiddler运行代码(在IE中不起作用):
http://jsfiddle.net/tejek/pZJMd/

最佳答案

如果您希望选择器仅与一个复选框一起使用,则选择器应为$('#chkbox'),即ID为chkbox的复选框,或者如果希望与每个复选框一起使用,则选择器应为$('input:checkbox')

另外,最好使用change事件而不是click事件,因为如果更改是通过鼠标单击以外的其他方式进行的,则单击事件(理论上)不应该触发。

也许尝试这样的事情:

$('input:checkbox').change(function () {
    var $this = $(this);
    if( $this.is(':checked') ) {
        $this.next('label').addClass('etykieta_wybrana');
    } else {
        $this.next('label').removeClass('etykieta_wybrana');
    }
});

参见DEMO

如果这样做没有帮助,请尝试在HTML中手动添加和删除类,以查看问题是否不是在添加类,而是没有通过一些古怪的怪癖模式渲染或其他方式显示出添加类的效果。

确保使用类似以下的内容来启动HTML:
<!doctype html>
<html lang="en-us">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=Edge;chrome=1">

确保您始终能充分利用IE渲染引擎。

关于jquery - addClass和removeClass在Internet Explorer中不起作用,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/5257866/

10-12 13:28