有没有可能找到导致页面滚动的函数？

Question

我正在尝试找出哪个函数会在悬停在元素上时导致页面滚动，但是到目前为止我没有找到。

从我的理解来看，该元素没有特定的监听器。它是通过mouseover监听器或类似方式触发的，这些元素包含许多附加到它们上面的监听器。

此外，这不是浏览器功能，而是特定于JavaScript的，因为当我将大部分代码设置为null时，它并不会发生。

我已经尝试了将我知道的滚动方法设置为null，例如：

[
    'scroll',
    'scrollTo',
    'scrollBy',
    'scrollByLines',
    'scrollByPages',
    'scrollX',
    'scrollY',
    'scrollMaxX',
    'scrollMaxY',
    'scrollHeight',
    'scrollIntoView',
    'scrollTop',
    'scrollTopMax'
].forEach(function(a) {
    window[a] = null;
    document.documentElement[a] = null;
})

希望当神秘的函数尝试调用滚动方法时会引发错误，但实际上它仍然可以正常滚动而没有任何问题。

我还尝试监听滚动事件，但没有返回值使我更接近负责的函数。

我尝试在压缩的源代码中查找它，但是常见的scroll搜索返回了266个结果，而且我甚至不确定它是否正在使用典型的滚动方法。

有没有办法可以定位使页面滚动的函数？

- Shadow

---

定位mouseover事件的源头并检查此函数。还可以尝试使用类似于以下内容的处理程序：getEventListeners(document.querySelector('.link')); - dfsq

@dfsq 鼠标悬停处理了许多其他功能，它们都被压缩了，我已经解释过这些元素有很多侦听器附加在它们上面。 - Shadow

@dfsq 如果有很多侦听器导致更多的调用堆栈，大部分是通过.call()和.apply()分布的，那我能做什么呢？这最终将变成逐行调试整个代码的相同事情。 - Shadow

@dfsq 抱歉，但这不是我正在寻找的解决方案，我正在尝试找到一种更简单的方法，而不是更复杂的方法。有多个模块附加到相同的侦听器，每个模块将事件传递给数百个复杂和相互连接的函数，所有这些函数都在缩小的代码中，最大的模块包含超过15,000行代码。也许如果您知道我在问题中没有列出的不同滚动方法，那么它会比您的建议更有帮助。以下是其中一个模块的示例 https://s.ytimg.com/yts/jsbin/www-en_US-vfl25nD3n/common.js - Shadow

你可以尝试使用这个Visual Event书签工具：http://pastebin.com/LUpteqrt。创建一个新的书签，将整个代码添加为URL，在查看页面时单击该书签。它会为每个元素创建一个覆盖层，显示其所有事件。您可以逐个删除事件覆盖层，以单独查找您要查找的事件。 - Stephan Muller

Answer 1

在2020年，前往Chrome的开发者工具，点击“Sources（源代码）”选项卡，在右边面板往下滚动到底部找到“Event Listener Breakpoints（事件监听器断点）”。 在这里你会找到“Control（控制）”组内的“scroll（滚动）”。勾选复选框将会停止执行（它是一个断点），每当滚动事件被触发时，你就能在同一面板中跟踪执行该操作的代码。在调试器进入后，通常在右侧面板的第一个组下方有“Call Stack（调用栈）”组。 图片参考：

- sandre89

---

这会在“滚动”事件上停止执行，但触发它的跟踪被丢失了，因此没有帮助。您只能看到正在运行的JavaScript线程的当前堆栈跟踪，但如果某些东西设置了body.scrollTop = 0，那么该JavaScript就消失了，在列表中不再可见。 - elixon

如@elixon所说，这并没有帮助找到滚动事件的来源。 - M Katz

它也不能在元素级滚动上工作。 - Josh M.

Answer 2

尝试了3天后，我第二次发布同样的问题后，终于找到了这个神秘函数，导致页面滚动的函数最终是.focus()。我记得很久以前学过它，但自从学会以后从未使用过它，并且它不容易与其他所有滚动函数相关联，所以一直困扰着我。

感谢所有尝试帮忙的人。希望将来有人能从中受益。

- Shadow

---

谢谢！在我的情况下，我正在使用一个传统的WebForms应用程序，并且由于form元素上的DefaultFocus属性，页面被滚动到了顶部：https://msdn.microsoft.com/en-us/library/system.web.ui.htmlcontrols.htmlform.defaultfocus.aspx?PHPSESSID=tn8k5... - kamilk

Answer 3

最近我们的应用程序也遇到了一个非常类似的意外滚动，最终将罪魁祸首锁定为Modernizr的CSS连字号特性检测。

问题报告在这里：https://github.com/Modernizr/Modernizr/issues/2172 就像你的情况一样，滚动是由对.focus()的调用引起的，因此它逃脱了我们最初对不想要的“滚动”代码调用的搜索。

- colin moock

Answer 4

在我的情况下，是一个带有 autoFocus 属性的输入组件。

<input type="text" autoFocus={true} />

我删除了该属性

<input type="text" />

- Fabiel León

Answer 5

<div onmouseover="scrollWin()">Hover over me and it scrolls down the page</div>
<p>You will need stuff here to see the scroll work</p>
<script>
function scrollWin() {
    window.scrollBy(0, 100);
}
</script>

- Robert Campbell

---

你需要创建这个函数，它的名称是scrollWin()。 - Robert Campbell

如果您能编辑您的答案并解释一下您展示的代码是做什么的，以及为什么/如何这段代码回答了问题，那将使您的答案更加有帮助。 - Lea Cohen

这个回答与我所问的问题完全无关。我想要找出（调试可能是更好的词）哪个函数负责页面滚动，而不是创建一个新的函数。在我的问题开头，我清楚地说“我正在尝试找出哪个函数导致页面滚动...”，是“找到” - 而不是“创建”或“制作”。甚至标题本身也非常清晰明了。 - Shadow

这个怎么样？您想知道哪个函数负责页面滚动？在哪个页面上？就我所知，可能是内容添加造成的，并且也许您并没有真正看到滚动。您的第一句话清楚地表明您正在尝试找到创建页面滚动的函数。我给了您一个例子，并提供了如何使用它的示例。此外，也许可以尝试搜索其他可能性，比如jquery：https://dev59.com/questions/nHjZa4cB1Zd3GeqPaBxo - Robert Campbell

你没有正确地阅读内容，我明确说过“我正在尝试找出哪个函数导致页面滚动”，而不是“尝试创建一个导致页面滚动的函数”。在我的整个问题中，我从未要求创建任何使页面滚动的函数，我正在尝试找出导致我正在研究的页面滚动的那个函数，并且我已经说过它确实是一个页面滚动，因为当我给该事件添加监听器时它会触发“scroll”事件。请不要再建议我创建更多的滚动函数或者使用无用的库。 - Shadow