Question

嗨我的功能有问题，当我调用它来显示隐藏的div时它不起作用。它没有显示隐藏的div。我之前的例子来自stackoverflow中发布的内容，但我的代码仍无效。

这是我的html文件

<div id="playTheGame" class="css/outer" style="display:none;" >
    <div class="css/inner">      
        <h1>Choose!</h1>
                    <section id="hand">
                <img src="images/rock.png">
                <img src="images/paper.png">
                <img src="images/scissors.png">
            </section>
 </div>
 </div>

我的功能

<script>
function logSuccess(){
    document.getElementById("playTheGame").style.visibility="visible";
}
</script>

我用于功能的按钮

<input type="button" onclick="logSuccess()" value="Show">

Answer 1

将您的代码更改为此

document.getElementById("playTheGame").style.display = "block";

由于您使用display属性隐藏它，因此请使用display属性显示它。

Answer 2

有两种选择：

使用JavaScript的人：

object.style.display="block"; // where object will be the playThemGame id element..

另一个使用jQuery; JavaScript库。

$("#playTheGame").show();

选项二不起作用，因为你也必须编写事件函数，所以只需使用第一个：

document.getElementById("playTheGame").style.display="block";

修改

因为您正在使用

document.getElementById("playTheGame").style.display="block";

要显示结果，您必须使用它来移除显示！

document.getElementById("playTheGame").style.display = "none"; to hide it back!

基本的想法是，这只会将object-->style-->display的值转换为none它不会再添加任何属性。它只是改变当前属性的值。

显示元素不起作用

2 个答案: