document.style.display 由于某种原因没有粘住

Question

编辑：所以我将 style.display 更改为阻止，其中一些有效。内部和外部文本区域返回找不到元素

---

另一个编辑：

在我的 CSS 中，我有一个 display:none。 当我删除它时，它可以工作。但这并不好，因为该元素仅应在单击后才可用。为什么将其设置为不显示会阻止它显示？

---

我在这里有一个简单的脚本。基本上我想将面板的所有内容设置为不可见（document.style.display =“none”），然后在我浏览完所有内容后，按照方法的指示将一个设置为可见。

Javascript：

function showText(divToShow)
{
    var docsToHide = document.getElementsByClassName("full-width");
    for (var i = 0; i<docsToHide.length;i++)
    {
        docsToHide[i].style.display="none";
    }
    var docToShow=document.getElementById(divToShow);
    docToShow.style.display="table";
    console.log(docToShow.style.display);
}

一些注意事项：full width 以如下形式返回 textAreas 的完整列表：

[textarea#page-description-textarea.full-width, textarea#keywords-text-area.full-width, textarea#files-textarea.full-width, textarea#internal-links-textarea.full-width, textarea#external-links-textarea.full-width]

在所有设置完成后的循环结束时，我将指定的 textArea(divToShow).display 设置为表格，但之后没有任何显示。

有什么想法吗？我忽略了什么吗？

---

编辑：为文本区域添加了 html

 <div id="text-column">
                    <div id="page-description-text">
                        <textarea id = "page-description-textarea" class="full-width">Page Description</textarea>
                    </div>
                    <div id="keywords-text">
                        <textarea id="keywords-text-area" class="full-width"> Keywords</textarea>
                    </div>
                    <div id="files-text">
                        <textarea id="files-textarea"class="full-width">files</textarea>
                    </div>
                    <div id="internal-links-text">
                        <textarea  id="internal-links-textarea" class="full-width">internal</textarea>
                    </div>
                    <div id="external-links-text">
                        <textarea id="external-links-textarea"class="full-width">external</textarea>
                    </div>
                </div>

最后要注意的是所有 textArea 元素都将自己设置为不可见。他们就是不回来了。

Answer 1

您是否将正确的id 传递给您的showText() 函数？

由于您的变量名为divToShow，我认为您正在传递<div> 的id，它正确设置了display:table，但您实际上隐藏了<textarea> 孩子，它保持隐藏状态。

如果您改为传递<textarea> 的id，代码函数将按预期工作，如this demo。