Question

我已经阅读了很多相关主题，无法获得我见过的任何解决方案。我有一个Div＆＃34; Section＆＃34;通过改变p的innerhtml来改变内容（图像，分机等）。当我在＆＃39;窗格之间切换时，我无法弄清楚为什么我无法将其滚动到#section的顶部。我是通过切换innerhtml创建的。换句话说，您通过单击图像/文本加载窗格，向下滚动并查看内容，然后在单击另一个窗格时加载窗格＆＃39;我只是想让它滚动到顶部。有什么想法吗？

这就是我目前所拥有的 -

     case 1:

                    text = '[new html] ';

                    document.getElementById("demo").innerHTML = text;
                    document.getElementById("section").scrollTo(0,0);
                    break;

这是加载时原始正文中的HTML -

<div id="section"><div id="sectionwrap">

<p id="demo"></p>
</div></div>

Answer 1

这是你想要的吗？理解你的问题有点困难所以请耐心等待:)。

window.onload = function(){
var x;
document.getElementById('aa').onclick = function() {
  document.getElementById("section").scrollTop = 0;
  document.getElementById("section").style.background = 'red';
};
};

p {
  padding: 0;
  margin: 0;
  font-family: Impact;
  line-height: 30px;
}
#sectionwrap {
  width: 100%;
  height: 1600px;
  background: rgba(255, 255, 122, .5);
}
#sidebar {
  width: 12.5%;
  height: 1000px;
}
#aa {
  background: blue;
}
#aa:hover {
  background: green;
}
#section {
  overflow-y: scroll;
  width: 100%;
  height: 200px;
  float: left;
  font-size: 2em;
  font-weight: bold;
  background: black;
  background-size: 100%;
  padding: 0%;
  text-align: center;
}

<body>
  <div id="section">
    <div id="sectionwrap">
      <p id="demo">1
        <br>
        <br>
        <br>
        <br>
        <div id="aa" onclick="z(9)">2</div>
      </p>
    </div>
  </div>
</body>

Answer 2

如果其他人有这个问题，我就让它发挥作用。

我有一个开关在#section div的innerHTML集之间改变（并切换一些其他整容的东西）。如果页面中有类似的设置，请在切换之前调用ScrollTop命令。这实现了我想要的是通过在每个开关案例中使用具有不同设置的开关来改变innerHTML，但是当调用“更改内容”函数时，让包含新html的div滚动回顶部。

ScrollTop和ScrollTo在Div中更改innerHtml时不起作用

2 个答案: