JavaScript 可见性不起作用（“隐藏”有效，“可见”无效）答案

【问题标题】：JavaScript visibility not working ('hidden' works, 'visible' doesn't)JavaScript 可见性不起作用（“隐藏”有效，“可见”无效）
【发布时间】：2012-08-28 03:55:02
【问题描述】：

我正在使用 Lombardi Teamworks BPM Tool 开发解决方案。该工具本身会生成客户端源代码，但我可以使用 JavaScript 输入代码，例如为组合框添加 onChange 代码..

无论如何，我有一个按钮，我正在尝试使用 JavaScript 切换其可见性。我可以使用hidden 隐藏按钮，但我无法使用visible 取消隐藏按钮。

这是完整的代码：

var eleBtnVisibilityTest = document.getElementById("btnVisibilityTest");
if (eleBtnVisibilityTest== null) {
            eleBtnVisibilityTest = document.getElementsByName("btnVisibilityTest");
}

alert("-->"+eleBtnVisibilityTest.style.visibility+"<--");

eleBtnVisibilityTest.style.visibility = "visible";

alert("-->"+eleBtnVisibilityTest.style.visibility+"<--");

在倒数第二行，我将按钮设置为visible，但它不起作用......但是，如果按钮之前可见，并且我在这里写了hidden，它会'已经工作了。

对于这两种情况，在警报 before 设置可见性中，我得到的弹出窗口说 --><-- .. 在弹出窗口 after 设置可见性中，它要么-->visible<-- 或 -->hidden<-- ..

有什么想法吗？

【问题讨论】：

标签： javascript visibility business-process-management

【解决方案1】：

尝试使用 CSS 显示属性：

display: block;
display:none;

【讨论】：

【解决方案2】：

document.getElementsByName 返回一个 NodeList，您必须从该列表中选择一个项目：

var eleBtnVisibilityTest = document.getElementById("btnVisibilityTest");
if (eleBtnVisibilityTest== null) {
            eleBtnVisibilityTest = document.getElementsByName("btnVisibilityTest")[0];
}

但是，当将可见性设置为隐藏作品时，这实际上不是这里的问题。

您应该提供更多详细信息，因为您的代码在与 getElementById 一起使用时有效
http://jsfiddle.net/doktormolle/4mhBk/

【讨论】：

【解决方案3】：

不确定您所说的“但它不起作用”是什么意思 - 您的意思是按钮保持不可见吗？

可能是按钮通过 CSS visibility 属性以外的其他方式隐藏。也许它也有display: none？在这种情况下，设置visibility 属性不会使按钮变得可见。使用 Chrome 的检查器等工具来检查是否是这种情况。

在 JSFiddle 上发布代码 sn-p，以便我们可以看到代码在运行中。

【讨论】：