Javascript 我在浏览器控制台中看到类的变化，但在浏览器中没有看到任何视觉变化

为了练习起见，如果将鼠标悬停在div上，我将尝试更改其背景色，并在将鼠标悬停在div上时将其还原。如果单击div，我会再次将其背景色更改为其他颜色，并使其可编辑。当您单击外部时，我会将一切恢复到正常状态，并使div再次成为只读

直到一小时前，我的代码在这两方面都运行良好——向目标元素添加和删除了所需的类，并且我可以看到元素的视觉变化

突然，尽管我看到CSS类在适当的事件中被正确地添加和删除，但是视觉变化停止了。换句话说，

#theDiv

的背景色在我将鼠标悬停在它的内部和外部以及在它的内部和外部单击时不会改变

我的代码位于git存储库中的一个名为的文件中

当它停止工作时，我创建了另一个文件来隔离我试图进行的更改，它们在temp.html中正常工作。他们只是突然停止了contentEditable.html中的工作

虽然代码已经在我的git回购中链接到上面，但为了您的方便，我也在这里复制它

$（文档）.ready（函数（）{
var theDiv=$（“#theDiv”）；
var isBeingEdited=假；
“鼠标悬停”，null，true，可上诉；
“mouseout”，空，假，可上诉；
打开（“单击dblclick”，null，true，makeEditable）；
“模糊”，空，假，使可编辑）；
函数makeAppearEditable（事件）{
日志（event.target+“：“+event.type）；
var targetElement=$（event.target）；
如果（正在编辑）{
返回false；
}
if（事件数据）{
targetElement.addClass（“可编辑”）；
}否则{
targetElement.removeClass（“可编辑”）；
}
};
函数makeEditable（事件）{
日志（event.target+“：“+event.type）；
var targetElement=$（event.target）；
isBeingEdited=event.data；
attr（“contenteditable”，event.data）；
if（事件数据）{
targetElement.addClass（“可编辑”）；
}否则{
targetElement.removeClass（“可编辑”）；
}
};
});
#theDiv{
最小宽度：400px；
最大宽度：50%；
}
;
.可编辑{
背景色：#f2e793；
}
;
.可编辑{
背景颜色：黄色；
}
;

这是一些文本。当您将鼠标悬停在其上时，它将更改其颜色，以指示可以对其进行编辑。当您单击或双击它时，它将再次更改其颜色并将变为可编辑。当您停止编辑并在其外部单击时，它将变为
不可编辑，并将其颜色更改回白色。
删除
从CSS，它将工作和更新CSS规则

; <======== remove it
.canBeEdited.editable {
  background-color: #f2e793;
}

#theDiv{
最小宽度：400px；
最大宽度：50%；
}
.可编辑{
背景色：#f2e793；
}
.可编辑{
背景颜色：黄色；
}

这是一些文本。当您将鼠标悬停在其上时，它将更改其颜色，以指示可以对其进行编辑。当您单击或双击它时，它将再次更改其颜色并将变为可编辑。当您停止编辑并在其外部单击时，它将变为
不可编辑，并将其颜色更改回白色。
删除
从CSS，它将工作和更新CSS规则

; <======== remove it
.canBeEdited.editable {
  background-color: #f2e793;
}

#theDiv{
最小宽度：400px；
最大宽度：50%；
}
.可编辑{
背景色：#f2e793；
}
.可编辑{
背景颜色：黄色；
}

这是一些文本。当您将鼠标悬停在其上时，它将更改其颜色，以指示可以对其进行编辑。当您单击或双击它时，它将再次更改其颜色并将变为可编辑。当您停止编辑并在其外部单击时，它将变为
不可编辑，并将其颜色更改回白色。
您是否尝试过清除浏览器缓存？@codemonkeh是的，我尝试过。在代码正常工作后的一段时间里，我一直在修补代码，但我记不起任何可能已更改的重要内容从CSS，它将工作什么的随机
在你的CSS中？删除它们，代码就会工作。投票以打字错误结束。你尝试过清除浏览器缓存吗？@codemonkeh是的，我尝试过。在代码正常工作后的一段时间里，我一直在修补代码，但我记不起任何可能已更改的重要内容从CSS，它将工作什么的随机
在你的CSS中？删除它们，代码就会工作。投票结束是打字错误。谢谢。成功了。在我给你打绿色支票前几分钟。好的，等一下。虽然
mouseover
和
mouseout
事件可以正常工作，但其他事件不能正常工作。也就是说，当我开始编辑或单击它时，它不会将背景颜色更改为其他颜色，同样，当我在div之外单击时也不会恢复。@WaterCoolerv2，尝试使用
.editable{background color:#f2e793！important；}
或
.canBeEdited.editable{background color:#f2e793；}
好的，我刚读到这篇
！重要的
规则，它确实有效，但我现在很好奇为什么我的代码会这样做，我问了一个新问题。我发现浏览器在
单击事件中被更改背景颜色的请求否决了。我想知道为什么。所以，我要问一个新问题。@WaterCoolerv2 As
可以编辑
是在以后定义的，CSS规则优先。对于测试，在
可编辑后定义
可编辑
，然后它将在没有
重要
的情况下工作。谢谢。成功了。在我给你打绿色支票前几分钟。好的，等一下。虽然
mouseover
和
mouseout
事件可以正常工作，但其他事件不能正常工作。也就是说，当我开始编辑或点击它时，