显示/隐藏 div 显示暴露 div 的底部
我有一个页面，有两个 div，一个隐藏，一个显示。当我单击页面底部的链接时，我希望显示隐藏的 div 并隐藏显示的 div。它工作正常，但如果浏览器高度很小（例如，在移动设备上），用户会看到显示的 div 一直滚动到底部。
页面如下：
<script type="text/javascript">
function display()
{
document.getElementById('div2').style.display="block";
document.getElementById('div1').style.display="none";
}
</script>
<!-- Start of content -->
<div id="div1" style="display:block">
<h2>This is shown at the beginning</h2>
<p>Hello</p><p>Hello</p><p>Hello</p><p>Hello</p><p>Hello</p><p>Hello</p>
<p>Hello</p><p>Hello</p><p>Hello</p>
<a rel="external" href="bogus.tar.gz" onclick="display(); return true">Click here</a>
</div>
<div id="div2" style="display:none">
<h2>This is shown later</h2>
<p>Goodbye</p><p>Goodbye</p><p>Goodbye</p><p>Goodbye</p><p>Goodbye</p><p>Goodbye</p>
<p>Goodbye</p><p>Goodbye</p><p>Goodbye</p>
</div>
如果我将链接放在页面的顶部，问题就会消失，但页面的流程要求链接位于页面的底部。
那么如何让浏览器在 div 显示后显示它的顶部。
I have a page with two divs, one hidden and one displayed. When I click on a link at the bottom of the page, I want the hidden div to display and the displayed div to be hidden. It works fine, but if the browser height is small (e.g., on a mobile device) the user sees the div that gets displayed scrolled all the way to the bottom.
Here is the page:
<script type="text/javascript">
function display()
{
document.getElementById('div2').style.display="block";
document.getElementById('div1').style.display="none";
}
</script>
<!-- Start of content -->
<div id="div1" style="display:block">
<h2>This is shown at the beginning</h2>
<p>Hello</p><p>Hello</p><p>Hello</p><p>Hello</p><p>Hello</p><p>Hello</p>
<p>Hello</p><p>Hello</p><p>Hello</p>
<a rel="external" href="bogus.tar.gz" onclick="display(); return true">Click here</a>
</div>
<div id="div2" style="display:none">
<h2>This is shown later</h2>
<p>Goodbye</p><p>Goodbye</p><p>Goodbye</p><p>Goodbye</p><p>Goodbye</p><p>Goodbye</p>
<p>Goodbye</p><p>Goodbye</p><p>Goodbye</p>
</div>
If I put the link at the top of the page, the problem goes away, but the flow of the page demands that the link be at the bottom of the page.
So how can I get the browser to show the top of the div once it gets displayed.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
如果要将页面滚动到顶部，请使用
“否则”，更改第二个参数。
If you want to scroll the page to the top use
Otherwise, change the second parameter.
在显示 div2 之前隐藏 div1。
如果它没有运行，请使用scrollto javascript（基于显示的div）调用来解决问题
hide the div1 before displaying the div2.
If it does not run, use a scrollto javascript (based on displayed div) call to fix the issue