mui 左侧选项卡-div模式 的选项卡切换监听

使用$('#segmentedControls').on('change', '.mui-control-item', function () { })和 document.getElementById("segmentedControls").addEventListener('.mui-control-item', function (e) {}) 都没有效果
后来使用querySelectorAll(".mui-control-item") 方法取所有类命为mui-control-item的元素,但是需要注意的是使用 querySelectorAll(".mui-control-item") 获取的是 数组,数组不能使用 addEventListener 需要遍历监听事件
所以不能写成querySelectorAll(".mui-control-item").addEventListener('tap', function (e) { })
而应该这样写:
document.querySelectorAll(".mui-control-item").forEach(function(item){
item.addEventListener('tap', function () {
//此处写需要实现的功能
})
})
问题解决。
mui 左侧选项卡-div模式 的选项卡切换监听的更多相关文章
- 监听浏览器tab选项卡选中事件,点击浏览器tab标签页回调事件,浏览器tab切换监听事件
js事件注册代码: <script> document.addEventListener('visibilitychange',function(){ //浏览器tab切换监听事件 if( ...
- local-语言切换监听事件
今天在更改时钟的问题的时候,需要监听语言切换来刷新时钟的显示.记录下监听方法 //注册监听事件 intentFilter.addAction(Intent.ACTION_LOCALE_CHANGED) ...
- mui日期插件$, each遍历,EventListener事件监听,json格式
(function($) { $.init(); var result = $('#result')[0]; var btns = $('.btn'); btns.each(function(i, b ...
- JS监听div的resize事件
原文地址:http://zhangyiheng.com/blog/articles/div_resize.html 需求 开发过程中经常遇到的一个问题就是如何监听一个div的size变化. 比如我用c ...
- Self Host模式下的ASP. NET Web API是如何进行请求的监听与处理的?
构成ASP.NET Web API核心框架的消息处理管道既不关心请求消息来源于何处,也不需要考虑响应消息归于何方.当我们采用Web Host模式将一个ASP.NET应用作为目标Web API的宿主时, ...
- 监听某个div或其它标签的大小改变来执行相应的处理
jquery 默认的resize只能监听到浏览器窗口大小的改变,但我们在实际使用过程中有可能还需要监听某个div或其它标签的大小改变来执行相应的处理,如果使用默认的resize就无能为力了.怎么办呢, ...
- 监听页面中的某个div的滚动事件,并将其滚动距离保存到cookie
在html中,写一个id为type的div: <div class="type" id="type"></div> css: .type ...
- MUI框架-12-使用原生底部选项卡(凸出图标案例)
MUI框架-12-使用原生底部选项卡(凸出图标案例) 今天,用 mui 做 app 时,遇到了可能各位都遇到过的头疼问题:底部中间图标凸起,如下图: 最后有源代码 [提示]:有人问我在 HBuilde ...
- 监听导航新增Tab选项卡-layui
1. 加载element模块 2. 监听导航事件 3. 创建选项卡 //加载element模块 layui.use('element', function () { element = layui.e ...
随机推荐
- Git--git log
参考 https://www.cnblogs.com/bellkosmos/p/5923439.html https://www.cnblogs.com/mkl34367803/p/9219913.h ...
- mysql时间类型总结及常用时间函数
日期时间和类型 常用日期和时间类型 字节 year 1 表示年份 值范围:(1901----2155) date ...
- 洛谷 P1709 隐藏口令
题目描述 有时候程序员有很奇怪的方法来隐藏他们的口令.Binny会选择一个字符串S(由N个小写字母组成,5<=N<=5,000,000),然后他把S顺时针绕成一个圈,每次取一个做开头字母并 ...
- Python的安装部署
Python的安装部署 参考:https://www.runoob.com/w3cnote/pycharm-windows-install.html 参考:https://jingyan.baidu. ...
- 干货 | AI人脸识别之人脸搜索
本文档将利用京东云AI SDK来实践人脸识别中的人脸搜索功能,主要涉及到分组创建/删除.分组列表获取.人脸创建/删除.人脸搜索,本次实操的最终效果是:创建一个人脸库,拿一张图片在人脸库中搜索出相似度最 ...
- rsync搭建
服务器: 查看是否安装:rpm -qa rsync 未安装则:yum install -y rsync 添加rsync用户 useradd -s /sbin/nologin -M rsync 编辑/e ...
- 寒假day17-本周计划
完善人才的数据挖掘模块 结合当下疫情完成人才动态模块 修正人才标签部分 优化界面
- __init__.py在Python中的用处
1.Python中的package定义很简单,其层次结构与程序所在目录的层次结构相同, 这一点与Java类似,唯一不同的地方在于,python中的package必须包含一个__init__.py的文件 ...
- tableau 和 R 的连接
1.安装R包Rserve 2.tableau帮助-管理外部服务连接,单击测试按钮出现成功连接即是通信成功. 3.创建新工作表,设置id字段,针对id记录数创建计算字段Rrand.将Rrand拖入行维度 ...
- [CF百场计划]#2 Codeforces Round #618 (Div. 2)
A. Non-zero Description: Guy-Manuel and Thomas have an array \(a\) of \(n\) integers [\(a_1, a_2, \d ...