单击Div使另一个Div出现

Question

我正在尝试创建一个提示框，其中您单击一个div，然后从可见性=隐藏到可见性=可见过渡。 到目前为止，这是我的代码，我不知道为什么它不起作用。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width">
        <meta name="description" content="">
        <meta name="keywords" content="">
        <meta name="author" content="C.K.">
        <title></title>
        <link rel="stylesheet" href="./css/main.css">
        <script type="text/js">
            document.getElementById("addpanel").onclick = document.getElementById("selector").style.visibility = "visble";
        </script>
    </head>
    <body>
        <div id="selector">
            SELECTOR
        </div>
        <div id="addpanel">
            <table id="add">
                <tr>
                    <td id="plus">+</td>
                </tr>
                <tr>
                    <td>Add New Item</td>
                </tr>
            </table>
        </div>
    </body>
</html>

Answer 1

看一下这个：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width">
        <meta name="description" content="">
        <meta name="keywords" content="">
        <meta name="author" content="C.K.">
        <title></title>
    <link rel="stylesheet" href="./css/main.css">
</head>
<body>
    <div id="selector">
        SELECTOR
    </div>
    <div id="addpanel">
        <table id="add">
            <tr>
                <td id="plus">+</td>
            </tr>
            <tr>
                <td>Add New Item</td>
            </tr>
        </table>
    </div>
   <script type="text/javascript">
    document.getElementById("selector").style.visibility = "hidden";
    document.getElementById("addpanel").onclick = function(){document.getElementById("selector").style.visibility = "visible";};
   </script>
</body>

Answer 2

HTML是从上到下解析的。 您的脚本将立即运行，以防万一它为解析器生成了更多的HTML以供处理（例如，使用document.write ）。 在document.getElementById("addpanel").onclick ， addpanel不存在，因为HTML解析器尚未到达。

将<script>块移动到apppanel元素的结束标记之后。

另外，onclick必须是一个功能。 因此它将是：

document.getElementById("addpanel").onclick = function() {
  document.getElementById("selector").style.visibility = "visible"
}

快速工作示例： https ： //jsfiddle.net/m2q6ubuv/

Answer 3

尝试这个

函数show（）{document.getElmenetById（'selector'）。style.visibility ='visible'; }

然后只需将onclick='show()'作为您想要成为按钮的标记中的属性即可。 另外，您应该将JavaScript放在页面的末尾，即</body>标记的开头。

单击Div使另一个Div出现

问题描述

3 个解决方案

解决方案1
1 已采纳 2017-07-18 01:35:38

解决方案2
0 2017-07-18 01:25:58

解决方案3
0

单击Div使另一个Div出现

问题描述

3 个解决方案

解决方案1 1 已采纳 2017-07-18 01:35:38

解决方案2 0 2017-07-18 01:25:58

解决方案3 0

解决方案1
1 已采纳 2017-07-18 01:35:38

解决方案2
0 2017-07-18 01:25:58

解决方案3
0