自动滚动：停止跳回页面顶部 [英] auto scroll: stop jumps back to top of page

问题描述

我有一个页面，用户点击一个链接开始自动滚动页面，以便阅读。用户点击另一个链接来停止滚动。前者完美地工作，但后者使页面跳回顶部点击，而不是停止滚动页面上的那个地方。任何想法？

I have a page in which the user clicks one link to start scrolling down the page automatically for ease in reading. There is another link the user clicks to stop the scrolling. The former works perfectly, but the latter makes the page jump back to the top when clicked instead of stopping the scrolling at the that place on the page. Any ideas?

function pageScroll() {
    window.scrollBy(0,1); // horizontal and vertical scroll increments
    scrolldelay = setTimeout('pageScroll()',50); // scrolls every 100 milliseconds
}
function stopScroll() {
    clearTimeout(scrolldelay);
}

我试着添加 return false; 从我在另一篇文章上阅读的东西中获得的第二个函数，但它没有帮助。无论如何，我不完全理解返回的使用。感谢您的任何帮助。

I tried to add return false; to the second function from something I read on another post, but it didn't help. I don't fully understand the use of return anyhow. Thanks for any help.

推荐答案

我假设您正在做这样的事情：

I assume that you're doing something like this:

<a href="#" onclick="pageScroll();">start</a>
<a href="#" onclick="stopScroll();">stop</a>

最快的解决方法是从 onclick 事件处理程序，如下所示：



The quickest fix is to return false from the onclick event handlers, like this:

<a href="#" onclick="pageScroll(); return false;">start</a>
<a href="#" onclick="stopScroll(); return false;">stop</a>

这个想法是阻止浏览器执行事件的默认操作（在这种情况下，到＃，它滚动到页面顶部）。现在，更现代的方法是绑定事件处理函数，然后使用 e.preventDefault（），但是返回false; 仍适用于旧式事件属性。

The idea is to stop the browser from doing the default action of the event (in this case, going to #, which scrolls to the top of the page). Nowadays, the more modern way is to bind an event handler function, then use e.preventDefault() in it, but return false; still works for old-style event attributes.

这篇关于自动滚动：停止跳回页面顶部的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！