DOM元素 onScrollToBottom监听示例
程序员文章站
2022-03-04 17:15:21
...
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>下拉滚动条滚到底部了吗？</title>
<body>
<div id="div1" style="overflow-y:auto; overflow-x:hidden; height:500px;">
<div style="background-color:#ccc; height:750px;">IE 和 FF 下测试通过</div>
</div>
<script>
HTMLElement.prototype.onScrollToBottom = function (callback) {
var _ele = document.querySelector("#div1");
if(_ele){
this.onscroll = function(e){
if(this.scrollTop + this.offsetHeight >= this.scrollHeight){
if(typeof callback == "function"){
callback();
}
}
return false;
};
}
}
document.querySelector("#div1").onScrollToBottom(function (e) {
alert("dao di le ");
})
</script>
</body>
</html>
上一篇： Vue - 动态添加移除 DOM元素（输入框示例）
下一篇： DOM解析示例