div 长页面：使用 Effect.toggle 展开底部的 div：页面滚动回顶部
我有一个看起来像这样的页面（是的，我已经包含了 scriptaculous javascript，因为切换实际上确实有效）：
<html>
<div id="container">
<div id="thing1" class="thing" >
<p>Some visible stuff 1</p><a href="#" onclick="Effect.toggle('extra1');">More1</a>
<div id="extra1" style="display:none;">
<p>Some extra and initially invisible stuff</p>
</div>
</div>
<div id="thing2" class="thing">
<p>Some visible stuff 2</p><a href="#" onclick="Effect.toggle('extra2');">More2</a>
<div id="extra2" style="display:none;">
<p>Some extra and initially invisible stuff</p>
</div>
</div>
<!-- 96 more entities of class="thing" -->
<div id="thing99" class="thing">
<p>Some visible stuff 99</p><a href="#" onclick="Effect.toggle('extra99');">More99</a>
<div id="extra99" style="display:none;">
<p>Some extra and initially invisible stuff</p>
</div>
</div>
</div>
</html>
当我单击 id="thing99" 处的“More99”链接时，该链接位于在页面底部，id="extra99" 处的 div 按其应有的方式显示，但页面随后自动滚动回顶部。
当我点击顶部的“More1”链接时，它始终聚焦在顶部。
无论如何，我可以阻止页面滚动回顶部和/或将其重新聚焦回我刚刚单击的位置吗？我不想向下滚动并找出我刚刚使哪一个可见。
I have a page of things that looks like this (and yes, I have included the scriptaculous javascripts, because the toggle actually does work):
<html>
<div id="container">
<div id="thing1" class="thing" >
<p>Some visible stuff 1</p><a href="#" onclick="Effect.toggle('extra1');">More1</a>
<div id="extra1" style="display:none;">
<p>Some extra and initially invisible stuff</p>
</div>
</div>
<div id="thing2" class="thing">
<p>Some visible stuff 2</p><a href="#" onclick="Effect.toggle('extra2');">More2</a>
<div id="extra2" style="display:none;">
<p>Some extra and initially invisible stuff</p>
</div>
</div>
<!-- 96 more entities of class="thing" -->
<div id="thing99" class="thing">
<p>Some visible stuff 99</p><a href="#" onclick="Effect.toggle('extra99');">More99</a>
<div id="extra99" style="display:none;">
<p>Some extra and initially invisible stuff</p>
</div>
</div>
</div>
</html>
When I click on the "More99" link at id="thing99" which is way down at the bottom of the page, , the div at id="extra99" appears as it should, but the page then the page automatically scrolls back to the top.
When I clck the "More1" link at the top, it stays focused at the top.
Is there anyway I can keep the page from scrolling back to the top and/or to refocus it back to where I just clicked? I don't want to scroll back down and find out which one I just made visible.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
在
Effect.toggle();调用之后尝试return false;。这不是处理此问题的理想方法，但它应该可以解决您眼前的问题。理想情况下，您应该从 HTML 中删除所有 Javascript，并取消所有
onclick属性，从远程 Javascript 块处理所有内容。Try
return false;after yourEffect.toggle();calls.This isn't the ideal way of handling this, but it should fix your immediate problem. Ideally, you would remove all of your Javascript from your HTML, and do away with all
onclickattributes, handling everything from a remote block of Javascript.乔纳森&塔图让我走上了正确的道路。我尝试过“return false”，有时确实有效。
有了“return false”的概念，我在 GOogle 上搜索，偶然发现了这个页面< /a> 用于 href 并返回 false。
那个“#”标签不断地让我回到页面顶部。我尝试了 href="" 没有“return false”，它按预期工作，但它也随机重新加载页面。
以下解决方案始终如一地满足了我的需求：
一切都按预期工作，并且没有随机页面重新加载。
Jonathan & Tatu started me on the right track. I tried "return false", and it worked some of the time.
With the "return false" concept in hand, I searched GOogle and stumbled on this page for hrefs and return false.
That "#" tag kept returning me to the top of the page. I tried href="" without the "return false", and it worked as desired, but it randomly reloaded the page as well.
The following solution gave me what I wanted consistently:
Everything worked as desired, and no random page reloads.