Javascript 在jquery中设置css时，背景颜色在Chrome中不改变

在我的JQuery/JS中，我正在检查并更改按钮的背景颜色和边框颜色，它在IE中运行良好，但在Chrome中，Chrome不会将颜色设置回灰色。IE的变化，只是没有铬。当我在调试器中查看呈现的html时，它没有添加颜色，只是不在那里！！！有趣的是，它在Chrome中添加了disabled属性，因此调用了将颜色设置回灰色的Jquery代码行

这是我的按钮，我将其初始化为灰色并被禁用

<button id="eventRegister" type="button" class="btn btn-lg btn-yb footer-button" style="background-color: grey !important; border-color: grey !important; display: none;" disabled>Register</button>

仅供参考-我认为它与我的site.css文件中的类“btn yb”有关，该类具有这些属性，但不确定

.btn yb{
背景色：#008489！重要；
颜色：白色！重要；
}
.btn yb:悬停，
.btn yb：焦点{
颜色：白色！重要；
}
.btn-yb.disabled，
[已禁用]。btn yb，
字段集[已禁用]。btn yb{
不透明度：1；
}

还可以更改您的javascript
src=”https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" >
$（“#registerEventTerms”）.off（'change'）.on（'change'，function（））{
if（$（this.prop（'checked'，true）；）
$（“#事件寄存器”）.css（'background-color'，''）.css（'border-color'，''）.prop（'disabled'，false）；
其他的
$（“#eventRegister”）.css（'background-color'，'grey！important'）.css（'border-color'，'grey！important'）.prop（'disabled'，true）；
});

还可以更改您的javascript
src=”https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" >
$（“#registerEventTerms”）.off（'change'）.on（'change'，function（））{
if（$（this.prop（'checked'，true）；）
$（“#事件寄存器”）.css（'background-color'，''）.css（'border-color'，''）.prop（'disabled'，false）；
其他的
$（“#eventRegister”）.css（'background-color'，'grey！important'）.css（'border-color'，'grey！important'）.prop（'disabled'，true）；
});

事情发生的顺序如下：

首先，您的内联

样式将被应用，并将按钮的
背景色设置为
灰色

接下来，您的样式表将

背景色设置为
#008489

最后，jQuery成功删除了内联样式

需要注意的是，jQuery的试图修改，因此它只能更新内联样式，而不能更新外部样式表。您的内联样式将被删除，而样式表规则不会被删除。因此，您可以看到样式表的背景色

请记住，内联样式比样式表样式更具特殊性。这只能用

覆盖！重要信息

。然而，多个

会让事情变得更加混乱！重要的

声明，因为您的所有规则本质上都在为最高的特定性而斗争。避免使用

！重要信息

，请尽可能选择

最简单的解决方法就是删除所有的

！重要

声明，因为这将允许以正确的顺序处理特定性：

$（“#registerEventTerms”）.off（'change'）.on（'change'，function（））{
如果（选中此项）
$（“#事件寄存器”）.css（'background-color'，''）.prop（'disabled'，false）；
其他的
$（“#事件寄存器”）.css（'background-color'，'grey'）.prop（'disabled'，true）；
});
.btn yb{
背景色：#008489；
颜色：白色；
}

注册
事情发生的顺序如下：

首先，您的内联
样式将被应用，并将按钮的
背景色设置为
灰色

接下来，您的样式表将
背景色设置为
#008489

最后，jQuery成功删除了内联样式

需要注意的是，jQuery的试图修改，因此它只能更新内联样式，而不能更新外部样式表。您的内联样式将被删除，而样式表规则不会被删除。因此，您可以看到样式表的背景色

请记住，内联样式比样式表样式更具特殊性。这只能用
覆盖！重要信息
。然而，多个
会让事情变得更加混乱！重要的
声明，因为您的所有规则本质上都在为最高的特定性而斗争。避免使用
！重要信息
，请尽可能选择

最简单的解决方法就是删除所有的
！重要
声明，因为这将允许以正确的顺序处理特定性：


$（“#registerEventTerms”）.off（'change'）.on（'change'，function（））{
如果（选中此项）
$（“#事件寄存器”）.css（'background-color'，''）.prop（'disabled'，false）；
其他的
$（“#事件寄存器”）.css（'background-color'，'grey'）.prop（'disabled'，true）；
});
.btn yb{
背景色：#008489；
颜色：白色；
}

注册
这不是支票是否到达代码行的问题，而是！代码甚至禁用了按钮，只是没有设置css颜色。因此，我不确定Chrome是否与IE的行为有所不同，当涉及到凌驾于之上的元素css属性remove！来自css.btnyb{背景色：#008489；}的重要信息，就是这样。为什么Chrome不允许这样做，但IE允许？？？@user1186050您在Chrome的javascript控制台中有没有任何错误。没有！我只是测试了一下，在控制台里看了看，什么都没有！有趣的这不是支票是否到达代码行的问题，而是！代码甚至禁用了按钮，只是没有设置css颜色
$("#registerEventTerms").off('change').on('change', function () {
        if (this.checked)
            $("#eventRegister").css('background-color', '').css('border-color', '').prop('disabled', false);
        else
            $("#eventRegister").css('background-color', 'grey !important').css('border-color', 'grey !important').prop('disabled', true);
    });