Question

我有一系列用css display隐藏的div：none;。

<div id="" class="hidden_row">some code</div>
<div id="" class="hidden_row">some code</div>
<div id="" class="hidden_row">some code</div>

我还有一个onclick“addRow（）;”按钮通过将其css声明更改为“display：block;”来设计为在每次单击时顺序显示一个隐藏行的函数。 javascript看起来像这样：

function addRow(){
    var hiddenrow = getElementsByClassName(document, "*", "hidden_row");

    for(var i=0; i< hiddenrow.length; i++){
        if(hiddenrow[i].style.display = "none"){
            hiddenrow[i].style.display = "block";
        }
    }
}

但是，该函数在执行时不会更改数组的1个成员（这是我想要的），它会找到隐藏的行并将它们全部显示出来。如何调整我的功能以使其按预期工作？

Answer 1

你的if语句中有拼写错误

if(hiddenrow[i].style.display = "none"){

应该是

if(hiddenrow[i].style.display == "none"){

编辑：请注意.style.display仅检查内联样式，因此您必须检查

if(hiddenrow[i].style.display != "block"){

相反，因为这更好地支持你想要的东西

正如Darhazer所说，如果你想一次只显示一个，你需要在找到你想要的那个之后放一个break;。

工作JsFiddle：http://jsfiddle.net/STGhq/

和你修改过的功能

function addRow(){
    var hiddenrow = document.getElementsByClassName("hidden_row");
    for(var i=0; i< hiddenrow.length; i++){
        if(hiddenrow[i].style.display != "block"){
            hiddenrow[i].style.display = "block";
            break;
        }
    }
}

<小时/> 针对element.style仅提取当前内联样式的问题，我发现this article使用window.getComputedStyle或element.currentStyle来解决这个问题，两者都引入了当前的计算样式，而不仅仅是内联声明。

使用新代码工作jsFiddle http://jsfiddle.net/STGhq/2/

Answer 2

首先，更正代码，因为您在if中分配值，而不是检查相等性。接下来，如果你可以打破循环，那么只显示第一个元素，显示为“none”。

for(var i=0; i< hiddenrow.length; i++){
        if(hiddenrow[i].style.display == "none"){
            hiddenrow[i].style.display = "block";
            break;
        }
    }

Answer 3

嗯，你在条件陈述中错误地输入'=='为'='吗？

Answer 4

如果您只希望将其应用于第一行，并且仅当它的显示为“none”时，则不要循环。相反，只需使用数组中的第一项，如下所示：

if (hiddenrow.length > 0 && hiddenrow[i].style.display == "none"){
    hiddenrow[0].style.display = "block";
}

OTOH，如果您只是想将此应用于第一项display =“none”，无论它是否是列表中的第一项，请执行：

for(var i=0; i< hiddenrow.length; i++){
    if(hiddenrow[i].style.display == "none"){
        hiddenrow[i].style.display = "block";
        break;
    }
}

break运算符会阻止循环继续。

数组的第一个成员

4 个答案: