单击任何 img 时隐藏一类元素答案

【问题标题】：Hide a class of elements when any img clicked单击任何 img 时隐藏一类元素
【发布时间】：2014-04-26 15:38:22
【问题描述】：

我正在尝试编写一个 javascript 来隐藏类“prewrap”的所有元素，当任何图像网页被点击。

到目前为止的代码：

<script type="text/javascript">
function hidepre() {
    var elems = document.getElementsByClassName("prewrap");
    for (var i = 0; i < elems.length; i++) {
        if (elems[i].style.visibility === "hidden") {
            elems[i].style.visibility = "visible";
        } else {
            elems[i].style.visibility = "hidden";
        }
    }
}
var imgs = document.getElementsByTagName("img");
for (var i = 0; i < imgs.length; i++) {
    imgs[i].onclick = "hidepre()";
}
</script>

Jsfiddle：http://jsfiddle.net/aX5kQ/

但这根本不起作用，知道出了什么问题吗？

【问题讨论】：

查看update。这是你想要的吗？（我刚刚从 JS 部分删除了 <script> 标签。
差不多，我可以让预包装一起消失，甚至没有空格吗？
为此，您需要将display 属性设置为none、like this。

标签： javascript web jsfiddle dom-manipulation

【解决方案1】：

您的代码正在运行，请检查此小提琴 DEMO

编辑

从您的jsfiddle 中删除script 标记，只留下代码。

   function hidepre() { 
    var elems = document.getElementsByClassName("prewrap");
    for (var i = 0; i < elems.length; i++) {
        if (elems[i].style.display === "none") {
            elems[i].style.display = "block";
        } else {
            elems[i].style.display = "none";
        }
    }
}
var imgs = document.getElementsByTagName("img");
for (var i = 0; i < imgs.length; i++) {
    imgs[i].onclick = hidepre;
}

同样在你的帖子中这一行应该更正->

var imgs = document.getElementsByTagName("img");
for (var i = 0; i < imgs.length; i++) {
    imgs[i].onclick = hidepre; //this line - here should only be the name of the function without quotes and parentheses 
}

【讨论】：

【解决方案2】：

如果您从 jsfiddle 的 JS 区域中删除 script 标记，它就可以正常工作（您将原始 javascript 放在那里.. 没有标记）

在http://jsfiddle.net/aX5kQ/1/编辑了演示

【讨论】：

【解决方案3】：

您好，这段代码是在图片加载之前立即执行的，所以没有找到 img。

var imgs = document.getElementsByTagName("img");
for (var i = 0; i < imgs.length; i++) {
    imgs[i].onclick = "hidepre()";
}

当 DOM 用 window.onload = ... 完成加载时执行此操作

【讨论】：