Question

我找到了这个代码，它是我问题的完美解决方案，但我发现它在ie9中不起作用。有谁知道如何重写这个代码在IE9中工作？这是它的javascript代码。

function showonlyonev2(thechosenone) {
    var newboxes = document.getElementsByTagName("div");
    for (var x = 0; x < newboxes.length; x++) {
        name = newboxes[x].getAttribute("class");
        if (name == 'newboxes-2') {
            if (newboxes[x].id == thechosenone) {
                if (newboxes[x].style.display == 'block') {
                    newboxes[x].style.display = 'none';
                }
                else {
                    newboxes[x].style.display = 'block';
                }
            } else {
                newboxes[x].style.display = 'none';
            }
        }
    }
}

我在jsFiddle中运行它并收到此错误：第4行第9个问题：只读。

name = newboxes [x] .getAttribute（“class”）;

这里也是HTML部分（短版本删除了head和body标签）：

<table>
   <tr>
      <td>
         <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px; width: 150px;">
            <a id="myHeader1" href="javascript:showonlyone('newboxes1');" >show this one only</a>
         </div>
         <div class="newboxes" id="newboxes1" style="border: 1px solid black; background-color: #CCCCCC; display: block;padding: 5px; width: 150px;">Div #1</div>
      </td>
      <td>
         <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px; width: 150px;">
            <a id="myHeader2" href="javascript:showonlyone('newboxes2');" >show this one only</a>
         </div>
         <div class="newboxes" id="newboxes2" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px; width: 150px;">Div #2</div>
      </td>
      <td>
         <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px; width: 150px;">
            <a id="myHeader3" href="javascript:showonlyone('newboxes3');" >show this one only</a>
         </div>
         <div class="newboxes" id="newboxes3" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px; width: 150px;">Div #3</div>
      </td>
   </tr>
</table>

这是我的jsFiddle视图 http://jsfiddle.net/Nuker_Viper/JvLDx/13/

Answer 1

您的修改使问题更加清晰：

我在jsFiddle中运行它并得到此错误：第4行第9个问题：只读。

name = newboxes[x].getAttribute("class");

您尚未在任何地方声明name，因此您在某些包含范围（可能是全局范围，例如name）中使用window.name。显然，IE9认为这是一个只读属性，虽然我找不到任何支持它的文档。

在任何情况下，你都不想与其他人的变量混淆。将var name;放在函数顶部，这样您就可以使用自己的变量了。： - ）

当我们不得不猜测出现了什么问题时的原始答案：

IE有一个长期存在的错误，它认为class属性被称为className，即使在getAttribute中也是如此。 IE9在错误命名的“兼容性”模式下继续这个错误。在标准模式下，它是正确的。

最好的办法是完全避免这个问题，因为getAttribute属性不需要使用class;请改用反射属性：

name = newboxes[x].className;

IE9不接受此代码

1 个答案: