使用$('#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模式 的选项卡切换监听的更多相关文章

  1. 监听浏览器tab选项卡选中事件,点击浏览器tab标签页回调事件,浏览器tab切换监听事件

    js事件注册代码: <script> document.addEventListener('visibilitychange',function(){ //浏览器tab切换监听事件 if( ...

  2. local-语言切换监听事件

    今天在更改时钟的问题的时候,需要监听语言切换来刷新时钟的显示.记录下监听方法 //注册监听事件 intentFilter.addAction(Intent.ACTION_LOCALE_CHANGED) ...

  3. mui日期插件$, each遍历,EventListener事件监听,json格式

    (function($) { $.init(); var result = $('#result')[0]; var btns = $('.btn'); btns.each(function(i, b ...

  4. JS监听div的resize事件

    原文地址:http://zhangyiheng.com/blog/articles/div_resize.html 需求 开发过程中经常遇到的一个问题就是如何监听一个div的size变化. 比如我用c ...

  5. Self Host模式下的ASP. NET Web API是如何进行请求的监听与处理的?

    构成ASP.NET Web API核心框架的消息处理管道既不关心请求消息来源于何处,也不需要考虑响应消息归于何方.当我们采用Web Host模式将一个ASP.NET应用作为目标Web API的宿主时, ...

  6. 监听某个div或其它标签的大小改变来执行相应的处理

    jquery 默认的resize只能监听到浏览器窗口大小的改变,但我们在实际使用过程中有可能还需要监听某个div或其它标签的大小改变来执行相应的处理,如果使用默认的resize就无能为力了.怎么办呢, ...

  7. 监听页面中的某个div的滚动事件,并将其滚动距离保存到cookie

    在html中,写一个id为type的div: <div class="type" id="type"></div> css: .type ...

  8. MUI框架-12-使用原生底部选项卡(凸出图标案例)

    MUI框架-12-使用原生底部选项卡(凸出图标案例) 今天,用 mui 做 app 时,遇到了可能各位都遇到过的头疼问题:底部中间图标凸起,如下图: 最后有源代码 [提示]:有人问我在 HBuilde ...

  9. 监听导航新增Tab选项卡-layui

    1. 加载element模块 2. 监听导航事件 3. 创建选项卡 //加载element模块 layui.use('element', function () { element = layui.e ...

随机推荐

  1. GTK入门

    环境准备 官网下载 GTK 源码包,因为本机 GLib 版本不够,下载一个非最新版的 GTK3.8.0 先学习用 直接阅读 "/gtk+-3.8.0/docs/reference/gtk/h ...

  2. 面向对象变成(OOP)-创建类和使用类

    1.1.1对象的抽象:抽象是一种归纳或总结,对象是现实世界物体特征的实例. (1)一切皆是对象. (2)类是对象的抽象. 1.1.2 对象的使用: 当对象被抽象为类以后,就可以创建具体的实例来操作了. ...

  3. python counter、闭包、generator、解数学方程、异常

    1.counter 2.闭包 3.generator 4.解数学方程 5.异常 1.python库——counter from collections import Counter breakfast ...

  4. 未能加载文件或程序集“MySql.Data”或它的某一个依赖项。找到的程序集清单定义与程序集引用不匹配。 (异常来自 HRESULT:0x80131040)

    未能加载文件或程序集“MySql.Data”或它的某一个依赖项.找到的程序集清单定义与程序集引用不匹配. (异常来自 HRESULT:0x80131040) 说明: 执行当前 Web 请求期间,出现未 ...

  5. Microsoft SQL server Management Studio工具报错“应用程序的组件中发生了无法处理的异常”

    解决办法 打开目录: C:\Documents and Settings\Administrator\Application Data\Microsoft\Microsoft SQL Server\1 ...

  6. linux tar/ tar.gz文件解压

    1.tar 压缩 tar -cvf jpg.tar *.jpg //将目录里所有jpg文件打包成tar.jpg tar -czf jpg.tar.gz *.jpg   //将目录里所有jpg文件打包成 ...

  7. D14 集合set 函数def

    把 字符串  元祖 变成集合的方法   因为列表是可变的所以不能变为集合 # s=set('hello')# print(s)## s=set(['alex','alex','sb'])# print ...

  8. CMake命令之export

    CMake中与export()相关的命令 (注:红色字体是标题,粉色是需要特别需要注意的地方) 总的来说,export()命令想要做的事情可以用一句话概括:Export targets from th ...

  9. Gradle project sync failed. Please fix your project and try again

    https://stackoverflow.com/questions/29808199/error-running-android-gradle-project-sync-failed-please ...

  10. 使用Anaconda安装TensorFlow

    conda create -n tensorflow python=2.7 # or python=3.3, etc. pip install --ignore-installed --upgrade ...