Javascript 如何在不滚动的情况下触发滚动事件
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/35879452/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to trigger an on scroll event without scrolling
提问by CTSchmidt
my Question is, how can i trigger (simulate or something esle) an on scroll event. In my special case I don't want to load all the Conservations in LinkedIn by scolling down all conservations, because there are too many!
我的问题是,我如何触发(模拟或其他东西)滚动事件。在我的特殊情况下,我不想通过缩小所有守恒来加载 LinkedIn 中的所有守恒,因为太多了!
I do not need a PHP or Javascript solution. Simply using dev-tools at chrome is enough to get my goal.
我不需要 PHP 或 Javascript 解决方案。简单地在 chrome 上使用 dev-tools 就足以实现我的目标。
回答by Pandaiolo
Alternatively, you can manually trigger a real scroll
event as following:
或者,您可以手动触发真实scroll
事件,如下所示:
el.dispatchEvent(new CustomEvent('scroll'))
Which feels a bit less of a hack (and more performant) than dual scrolling by +1
and -1
pixels...
与双滚动+1
和-1
像素相比,这感觉更少(并且性能更高)......
This should run any piece of code listening for a scroll
event.
这应该运行任何一段侦听scroll
事件的代码。
Edit: To support IE11
or other legacy browser, consider using a CustomEvent
polyfill such as mdn-polyfills
编辑:要支持IE11
或其他旧版浏览器,请考虑使用CustomEvent
polyfill,例如mdn-polyfills
回答by Fran Cano
This doesn't work on Chrome or Firefox
这不适用于 Chrome 或 Firefox
window.scrollTo(window.scrollX, window.scrollY);
This works on both:
这适用于:
window.scrollTo(window.scrollX, window.scrollY - 1);
window.scrollTo(window.scrollX, window.scrollY + 1);
Not fancy, but works.
不花哨,但有效。
Note that only the first line of code is necessary, the other one is just to return the scroll back to where it was. I had to trigger a scroll function on a button. If you happen to tap the button twice, the effect of the scroll is visible and it's not very fancy. That's why I prefer adding the 2nd line of code as well.
请注意,只有第一行代码是必需的,另一行代码只是将滚动返回到原来的位置。我不得不在按钮上触发滚动功能。如果你碰巧点了两次按钮,滚动的效果是可见的,也不是很花哨。这就是为什么我更喜欢添加第二行代码。
回答by Mike 'Pomax' Kamermans
You absolutely need a Javascript solution. What else is going to do the event listening/triggering, do you think?
您绝对需要一个 Javascript 解决方案。你认为还有什么可以做事件监听/触发?
If you want to firea scroll event, just literally scroll to where you already are by typing window.scrollTo(window.scrollX, window.scrollY);
in your scripts or dev tools console. Alternatively, you can fake one using a combination of CustomEventand the dispatchEventfunction.
如果您想触发滚动事件,只需window.scrollTo(window.scrollX, window.scrollY);
在脚本或开发工具控制台中键入即可滚动到您已经所在的位置。或者,您可以使用CustomEvent和dispatchEvent函数的组合来伪造一个。
If you want to trigger something on a scroll event, listen for scrolls using window.addEventListener("scroll", function(evt) { ... });
and make the handling function do whatever it is you need to do.
如果您想在滚动事件上触发某些内容,请使用滚动监听window.addEventListener("scroll", function(evt) { ... });
并使处理函数执行您需要执行的任何操作。
回答by user2280102
window.scrollTo(window.scrollX, window.scrollY);
is not working for me in Firefox.
Nothing happens, and it seems to be because no scrolling actually needs to be performed to go to the place where you allready are.
window.scrollTo(window.scrollX, window.scrollY);
在 Firefox 中对我不起作用。什么也没有发生,似乎是因为实际上不需要滚动才能到达您已经所在的位置。
BUT window.scrollTo(window.scrollX, window.scrollY-1);
is working. By this command the window.scroll
event function is fired.
但是window.scrollTo(window.scrollX, window.scrollY-1);
正在工作。通过这个命令window.scroll
触发事件函数。
(Trying to cheat by for instance:
window.scrollTo(window.scrollX, window.scrollY-0)
is not working either.)
(例如,试图作弊:
window.scrollTo(window.scrollX, window.scrollY-0)
也不起作用。)
回答by Behnam Azimi
As everybody replied, window.scrollTo(window.scrollX, window.scrollY);
is work truly but in some cases, you should add a number to the windows current scroll position, for example in my case I added 1to my scrollY and then called scrollTo
method like this:
正如每个人都回答的那样,window.scrollTo(window.scrollX, window.scrollY);
确实有效,但在某些情况下,您应该向 Windows 当前滚动位置添加一个数字,例如在我的情况下,我向scrollY添加了1,然后scrollTo
像这样调用方法:
window.scrollTo(window.scrollX, window.scrollY + 1);
window.scrollTo(window.scrollX, window.scrollY + 1);
回答by Katinka Hesselink
For my use-case I needed to change 'scrollX' to 'pageXOffset' and 'scrollY' to 'pageYOffset' to get a non-scrolling-scroll working in IE 11 (Internet Explorer):
对于我的用例,我需要将 'scrollX' 更改为 'pageXOffset' 并将 'scrollY' 更改为 'pageYOffset' 以获得在 IE 11 (Internet Explorer) 中工作的非滚动滚动:
window.scrollTo(window.pageXOffset, window.pageYOffset - 1);
window.scrollTo(window.pageXOffset, window.pageYOffset + 1);
回答by Jerry Ni
Sometimes you need find the scrollElement. In my case, my scrollElement is body and running on mobile, so below code works fine:
有时您需要找到 scrollElement。就我而言,我的 scrollElement 是 body 并且在移动设备上运行,所以下面的代码工作正常:
document.body.scrollTo(window.scrollX, window.scrollY + 1);
document.body.scrollTo(window.scrollX, window.scrollY + 1);
Hope it will be helpful.
希望它会有所帮助。
回答by Samuel P
A litle bit off topic:
有点跑题了:
You dont need to use the dev tools just create a bookmark with the folowing "url"
您不需要使用开发工具,只需使用以下“url”创建书签
javascript:(function(){
/* Put your code here, e.g. the scrollng event or add an
event listener to the current page or some other code*/
})();
when you click this bookmark, the cod will be executed, inside the current page's environment
当您单击此书签时,将在当前页面的环境中执行 cod