JQuery 更改 CSS 显示不起作用

Question

我在 Chrome 和 Firefox 上工作，基本上当用户单击子图像时，它会通过将其显示属性从隐藏更改为显示来更改主图像。这是我的 img 元素。

<img id="lg1" src="http...
<img id="lg2" style="display:none" src="http...
<img id="lg3" style="display:none" src="http...

我的 js 看起来像这样:

    $('#graph1').click(function() {
    $("#lg1").css("display","inherit");
    $("#lg2").css("display","none");
    $("#lg3").css("display","none");
});

$('#graph2').click(function() {
    $("#lg1").css("display","none");
    $("#lg2").css("display","inherit");
    $("#lg3").css("display","none");
});

$('#graph3').click(function() {
    $("#lg1").css("display","none");
    $("#lg2").css("display","none");
    $("#lg3").css("display","inherit");
});

在 IE 中我收到此错误:

Could not get the display property. Invalid argument.

我是否可以更改我的代码以使其适用于 Chrome、FF 和 IE？

谢谢!

Answer 1

遗憾的是，“继承”在 IE 上不是有效的显示值。您可以尝试“”，它应该可以工作( live example )，除非某些样式表规则对该元素另有说明( like this )。

偏离主题，但如果您想要更短的方式来编写 .css("display", "none") 您可以使用 .hide() 代替。 :-)