为什么点击按钮会出现页面闪烁?

joy_zxj 2016-11-28 10:21:51
var $ = function (el) {
return document.querySelector(el)
};
$("#button2").onclick=function () {
var wallNum=15;
while(wallNum!==0){
var row=Math.ceil((Math.random()*10));
var col=Math.ceil((Math.random()*10));
if(row!==initRow||col!==initCol){
buildingWall(row,col,"darkgrey");
}
wallNum--;
}
return false;
};

function buildingWall(row,col,color) {
var elem = $("#map").getElementsByTagName("div")[row].getElementsByTagName("span")[col];
elem.style.backgroundColor=color;
}
...全文
1482 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
yangyanORZ 2019-09-21
  • 打赏
  • 举报
回复
是由于设置了横向滑动条 over-flow:auto; 的原因. 解决方法: 1.去掉滑动条 2.或者将弹出层或父级div宽度加大点. 不要刚刚好.
2016-11-29
  • 打赏
  • 举报
回复
没有出现闪烁

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
        <title>demo</title>
        <style type="text/css">
            #map{ border:1px solid #ccc; width:220px;}
			#map div span{display:inline-block; width:20px; height:20px; border:1px solid #eee;}
        </style>
    </head>
    
    <body>
        <div id="map"></div>
        <input type="button" id="button2" value="开始">
    </body>
    <script type="text/javascript">
        var initRow = 5, initCol = 5;
        var $ = function(id) {
            return document.getElementById(id);
        };
        $("map").innerHTML = new Array(11).join("<div>" + new Array(11).join("<span></span>") + "</div>");
        $("button2").onclick = function() {
            var wallNum = 15;
            while (wallNum !== 0) {
                var row = parseInt((Math.random() * 10));
                var col = parseInt((Math.random() * 10));
                if (row !== initRow || col !== initCol) {
                    buildingWall(row, col, "darkgrey");
                }
                wallNum--;
            }
            return false;
        };

        function buildingWall(row, col, color) {
            var elem = $("map").getElementsByTagName("div")[row].getElementsByTagName("span")[col];
            elem.style.backgroundColor = color;
        }
    </script>
</html>
joy_zxj 2016-11-29
  • 打赏
  • 举报
回复
蟹蟹同学,我也认为这块不应该出现这个问题,但在我代码里实现这个功能的时候点击按钮确实会出现闪烁,可能原因不在这。

87,901

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧