使用$('#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. 一天一个设计模式——Composite组合模式

    一.模式说明 能够使容器与内容物具有一致性,创造出递归结构的模式就是Composite组合模式. 举个例子:计算机中的文件系统中有文件和文件夹的概念,我们知道,文件夹可以包含文件,也可以包含子文件夹, ...

  2. UVA - 10285 Longest Run on a Snowboard(最长的滑雪路径)(dp---记忆化搜索)

    题意:在一个R*C(R, C<=100)的整数矩阵上找一条高度严格递减的最长路.起点任意,但每次只能沿着上下左右4个方向之一走一格,并且不能走出矩阵外.矩阵中的数均为0~100. 分析:dp[x ...

  3. Tensorflow学习教程------简单练一波,线性模型

    #coding:utf-8 import tensorflow as tf import numpy as np #使用numpy 生成100个随机点 x_data = np.random.rand( ...

  4. 洛谷 P2341 [HAOI2006]受欢迎的牛|【模板】强连通分量

    题目传送门 解题思路: 先求强联通分量,缩点,然后统计新图中有几个点出度为0,如果大于1个,则说明这不是一个连通图,答案即为0.否则入度为0的那个强连通分量的点数即为答案 AC代码: #include ...

  5. oracle(8)视图和查询数据库对象方法

    视图 view 视图是数据库的对象之一. 视图也叫做虚表,既虚拟表,本质是对应一条select 语句, select语句的结果集赋予一个名字就是视图的名字. 作用: 1.可以简化复杂的查询 2.可以限 ...

  6. CSS 宽,高,背景设置

    width 宽,height 高,background 背景:背景色 background-color:颜色值--英文单词/十六进制/rgb:背景图 background-image:url(‘图片路 ...

  7. SpringCloud----服务注册中心Eureka

    Eureka是Netflix开源的一个RESTful服务,主要用于服务的注册发现.Eureka由两个组件组成:Eureka服务器和Eureka客户端.Eureka服务器用作服务注册服务器.Eureka ...

  8. hdu1312题解

    这道题从名称来看看不出什么. 所以我们先读一下题干 There is a rectangular room, covered with square tiles. Each tile is color ...

  9. PL/SQL 连接oracle步骤

    下面就将PL/SQL的配置说明一下. 一.安装Oracle客户端,让后配置    安装目录下面的C:\ORACLE\instantclient_11_2\NETWORK\ADMIN 的 tnsname ...

  10. Class.forName(String className)解析

    功能: Class.forName(xxx.xx.xx)返回的是一个类 Class.forName(xxx.xx.xx)的作用是要求JVM查找并加载指定的类, 也就是说JVM会执行该类的静态代码段 一 ...