使用 JavaScript/jQuery 滚动到 DIV 的顶部？

Posted 2023-05-08

【中文标题】使用 JavaScript/jQuery 滚动到 DIV 的顶部？

【英文标题】：Scroll to the top of a DIV using JavaScript/jQuery?

【发布时间】：2017-11-29 18:54:27

【问题描述】：

我有一个<div> 弹出窗口，当单击链接时会显示该弹出窗口。 如果有溢出，它有可滚动的内容。

如果再次单击链接，我只需要在可滚动区域的顶部添加<div>。 这在 Chrome 和 Firefox 中运行良好，但在 IE 中，它仍然滚动到弹出窗口的底部。

<div id="myModal" data-role="popup" data-position-to="window" data-history="false" data-theme="a" data-corners="true" class="ui-content" style="text-align:center">
    <div class="modal-dialog">
         <div class="modal-content">
             <div id='myModalContent'></div>

             <a href="#" id="closeButton" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-b">OK</a>
         </div>
    </div>
</div>   

$(".anchorDetail").click(function () 
    $("#myModal").scrollTop(0);

【问题讨论】：

你有一个 jsfiddle 复制你的问题吗？

看看这个？可能是要尝试的东西。 ***.com/questions/6736849/scrolltop-not-working-in-ie

我已经试过了，Paige，它甚至不想在 FF 或 Chrome 中工作。我在这里搜索了尽可能多的问题。没有jsfiddle，还没有。我没有包含的其余 JS 从 ajax 调用中提取数据。

你试过$("#myModal")[0].scrollTop(0);吗？也许……

您可能想尝试将this cross-browser animation 置顶...我在几个项目中使用它，并在用户滚动页面时淡入淡出一个漂亮的置顶图像...

【参考方案1】：

试试这个，它是用 JS 而不是 jQuery 完成的：

document.querySelector('.anchorDetail').addEventListener('click', function() 
var myDiv = document.getElementById('myModal');
myDiv.scrollTop = 0;
);

【参考方案2】：

谢谢大家的建议。

我觉得自己好笨。 我让它在填充数据并打开弹出窗口之前尝试滚动到顶部。

我将 .scrollTop() 函数移至打开弹出窗口后，瞧。

再次感谢大家。