问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

关于onclick 点击事件要点两次才能显示的问题

头像
鱼唇红
    63174165

    menu[4].onclick=function(){

    dis('menu4');

    }

    function dis(disp){

    var str=document.getElementById(disp);
    var dis=str.style.display;
    if(dis=='none'){
    str.style.display='block';
    }else{
    str.style.display='none';

    }

    }
    这个简单下拉菜单的效果要点击两次才能实现 为什么 要怎么处理

    javascript
    阅读 3.7k
    4 个回答
    得票最新
    头像
    嘿8你的益达
      4651411
      <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格</title>
</head>
<body>
    <div id="btn" style="width: 100px;background-color: yellow;">按钮</div>
    <div id="disp" style="width:400px;height: 400px;background-color: red;"></div>
    <script>
        var Btn = document.getElementById('btn');
        Btn.onclick = function(){
            dis('disp');
        };

        function dis(getId){
            var str = document.getElementById(getId);
            var dis = str.style.display;
            if( dis == 'none' ){
                str.style.display = 'block';
            }else{
                str.style.display = 'none';
            }
        }
    </script>
</body>
</html>

      没看出来你的代码问题出在哪里，要想知道bug那就只能用游览器开发模式打断点了。。。

      头像
      will233
        53831931

        display 没有初始化吧

        头像
        Justin
          1.4k41232

          var dis = str.style.display; 看看这个时候的dis是block还是none,如果是block 点击第一次的时候根据判断走的是str.style.display='none'; 还是隐藏；再点一次才是block 显示。

          头像
          Even_Yu
            1.4k934

            首先兄弟 你那个 获取其ID名时不该加引号吗？ 引号没有 严格来说不知道你这个为啥会执行，你在点击事件中又调用了个函数 其实兄弟 你如果只想点击一次 那你直接把那个写到DOM0级事件不是更好吗？ 或者说你想点击两次为啥不绑个dbonclick呢? 你这个在函数体内部声明的变量全部为局部变量 难道你不担心你想在外部引用时 引用不到吗？

            撰写回答
            你尚未登录，登录后可以
            • 和开发者交流问题的细节
            • 关注并接收问题和回答的更新提醒
            • 参与内容的编辑和改进，让解决方法与时俱进
            推荐问题