使用addClass（）在IE6中未应用的类

我的HTML中包含以下DIV，其中包含大量背景图像：

根据选择页面上表单上的选择框，背景图像将滚动到不同的点。 这些位置的定义如下：

 #widget-image.tyreinfo1 { background-position: 0px -105px } #widget-image.tyreinfo2 { background-position: 0px -210px } #widget-image.tyreinfo3 { background-position: 0px -315px } #widget-image.tyreinfo4 { background-position: 0px -420px } #widget-image.tyreinfo5 { background-position: 0px -525px } 

选择框上的代码是：

 onfocus="$('#widget-image').removeClass().addClass('tyreinfo1');" 

5个选择框，每个框添加一个不同的tyreinfo类。

令人惊讶的是，它在IE6中不起作用。 我已经使用调试工具栏进行了检查，并且确实正在应用这些类，但是每次背景位置都会重置为0px 0px。

任何帮助赞赏！

Answer 1

首先手动编写html和css以检查CSS是否正常工作，我怀疑这是由IE6的错误CSS实现引起的。

我想你是在＃widget-image上设置背景图像（完全合理）但IE6会将’＃widget-image.tyreinfo1’读作’.tyreinfo1’（完全有缺陷），这意味着＃widget-image上的定位需要偏爱。 你可以试试

 #widget-image.tyreinfo1 { background-position: 0px -105px !important } 

但是你可能最好为每个class级设置完整的背景风格。

Answer 2

试试这个：你只是简单地指定了.removeClass（），你没有指定要删除的类。 我认为你试图删除现有的类并为其添加一个新类。 所以这就是我的建议。

 $('#widget-image').removeAttr('class').addClass('tyreinfo1'); 

Answer 3

您使用的是PNG和PNG修复程序脚本吗？ 如果是这样，后台定位将无法在IE6中运行。 每次更新位置时，还必须添加图像URL。

Answer 4

我同意@Inrbob。 首先写出CSS以确保它以这种方式工作。 然后，如果是，那么试试这个：

你有选择权吗？ 为每个选择一个id。 然后附加一个单独的javascript文件，并使用ID调用它。

 $('#id1').click(function() { $('#widget-image').removeAttr('class').addClass('.whatever'); }); 

您也可以尝试另一种方法，即使用focus（）。

 $('#id1').focus(function() { $('#widget-image').removeAttr('class').addClass('.whatever'); }); 

我怀疑任何解决方案都应该有效。

如果没有，那么我建议用http://jsfiddle.net发布你的整个HTML和CSS，让我们仔细看看整个情况。

祝好运。

Answer 5

也许是因为你的css定义缺少一个分号;

 #widget-image.tyreinfo1 { background-position: 0px -105px; } 

否则，您可以尝试通过更改属性的值来更改类，例如：

 onfocus="$('#widget-image').attr('class','tyreinfo1');" 

在某些情况下，这对我有用，其他方法也失败了。 但是，发布更多示例代码当然可以提供帮助。