GlobalEventHandlers.onscroll
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.
元素的 scroll 事件处理函数。
语法
element.onscroll = functionReference
参数
functionReference 是一个函数的引用。当该元素滚动时，会执行该函数。
备注：不要将 onscroll 与 onwheel混淆。onwheel 是鼠标滚轮旋转，而 onscroll 处理的是对象内部内容区的滚动事件。
示例
Example
这个示例能说明更多问题
This example monitors scrolling on a <textarea>, and logs the element's vertical scroll position accordingly.
HTML
html
<textarea>1 2 3 4 5 6 7 8 9</textarea>
<p id="log"></p>
CSS
css
textarea {
width: 4rem;
height: 8rem;
font-size: 3rem;
}
JavaScript
js
const textarea = document.querySelector("textarea");
const log = document.getElementById("log");
textarea.onscroll = logScroll;
function logScroll(e) {
log.textContent = `Scroll position: ${e.target.scrollTop}`;
}
Result
注意
当用户滚动某个元素的内容时 scroll 事件将会被触发。Element.onscroll 同等于 element.addEventListener("scroll" ... )。
规范
| Specification |
|---|
| CSSOM View Module # eventdef-document-scroll |
| HTML # handler-onscroll |