如何通过单击隐藏在JavaScript中的div来触发函数?

时间:2015-04-03 00:52:17

标签: javascript html css javascript-events visibility

我在javascript中有一个div,最初是隐藏的。现在我希望这个div在我点击它时再次显示它的位置,因为它对我来说不可见,但是我无法触发javascript使其再次可见的功能。那么实现同样目标的替代方法是什么呢?

示例代码如下:

<div id="box"style="width:400px; height:300px; background-color:black; visibility:hidden" onclick="show(box)">

功能如下:

function show(id) {
document.getElementById(id).style.visibility = "visible";
}

但是上面不起作用,请提出另一种方法。

1 个答案:

答案 0 :(得分:1)

我不是将显示设置为无或隐藏的可见性,而是改为不透明度:

function show(id) {
    document.getElementById(id).style.opacity = 1;
}
<div id="box" style="width:400px; height:300px; background-color:black; opacity:0" onclick="show('box')">

另请注意,您需要在事件处理程序(onclick="show('box')")中使用引号,否则浏览器会假定box是变量。