时间戳

首页 > 解决方案 > 为什么当我在javascript中动态添加新元素时禁用滚动

javascript - 为什么当我在javascript中动态添加新元素时禁用滚动

问题描述

我在我的代码中有一个add button当我点击它时，一个新div元素被添加到布局中，问题是当我动态添加多行时，页面的滚动不起作用

下面我如何在按钮单击时添加元素

function add(event) {

  event.preventDefault();  
      var deletebutton =  document.createElement("button");

    deletebutton.addEventListener("click",function(evt){
      deleterow(evt,'div' + i + '')
      });


 var newDiv = document.createElement("div");
 newDiv.className="form-group";
 newDiv.id="div" + i;

 newDiv.appendChild(deletebutton);
 
  document.getElementById("tab_logic").appendChild(newDiv);

  }

在按钮的代码下方，我单击以动态添加行

<button id="add_row" style="background-color:#90EE90;"  onclick="add(event)" >
                             
                          </button></div>

标签： javascripthtml

解决方案

document.getElementById("tab_logic")

这是您可能想要查看的元素。有几件事可能会发生：

  • 您要添加的position: absolute元素不是元素布局的一部分，因此元素不知道它需要滚动
  • #tab_logic有overflow: hidden样式集，或者没有overflow样式集，也许应该是overflow: auto
  • 您的#tab_logic元素的父元素也可能有这些相同的问题：沿着树跟踪它并确保在某处没有导致问题的绝对布局或溢出设置。

推荐阅读