vue中监听滚动事件:方法简单留着备用

yumo6668个月前 (04-23)技术文章37

看似简单的功能事件,难道了不少朋友,不是功能有多难,而是对原理不了解浪费不少时间;简单明了收藏备用,或推荐给初学的朋友,赠人玫瑰手留余香;

在mounted中监听滚动元素的ID;‘scroll’监听事件名称,this.handleScrol要出发的函数;

mounted() {

document.getElementById('元素ID').addEventListener('scroll',this.handleScroll)

},

被出发的函数,下面用的jQuery获取元素和事件

handleScroll(){
 let sss = $("元素ID").scrollTop();
 console.log(sss);
}

备注:获取元素父元素的ID,因为滚动条属于父元素,如果获取的是子元素,那永远获取的scrollTop的值都是0;

相关文章

Selenium 滚动页面至元素可见的方法,看完直接可上手了!

今天为大家带来的内容是:Selenium 滚动页面至元素可见的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧!滚动页面  在...

selenium:操作滚动条的方法(8)

selenium支持几种操作滚动条的方法,主要介绍如下:使用ActionChains 类模拟鼠标滚轮操作使用函数ActionChains.send_keys发送按键Keys.PAGE_DOWN往下滑动...

Excel制作字幕滚动窗体

要制作字幕上下滚动的窗体,可以结合Windows API函数,并修改标签位置来滚动字幕。思路字幕,可以通过设置Label标签的标题来实现。字幕滚动,可以在循环中动态修改Label位置。知识点本节需要用...

10款流行的Markdown编辑器

1、 用户能借助键盘快捷键或工具栏按钮应用及删除 Markdown 格式。MarkdownPad 的左右栏分隔设计,可让用户实时查看以 HTML 格式呈现的 Markdown 文档效果。2、 WMD3...

告别繁琐代码?Maxun:你的无代码网页数据抓取新选择

告别繁琐代码?Maxun:你的无代码网页数据抓取新选择还在为网页数据抓取而头疼吗?还在苦苦学习复杂的编程语言吗?别担心,开源项目 Maxun 来了!它就像一位魔法师,让你无需编写任何代码,就能轻松驾驭...

使用Qt实现五颜六色的滚动条

要实现五颜六色的滚动条,可以使用QSS(Qt样式表)来设置滚动条的颜色。以下是一个简单的示例代码,可以设置滚动条的背景颜色为红色:```cppQScrollBar* scrollBar = ui-&g...