关于mui中ul列表需要点击多次生效的问题

最新推荐文章于 2021-08-30 23:17:40 发布
最新推荐文章于 2021-08-30 23:17:40 发布
阅读量611 收藏
点赞数 1
分类专栏： H5移动开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wugezi/article/details/88368794
版权

只需要为相应的ul列表添加下列代码，纯种的clik也能生效

mui("#personal_ul").on('tap', 'a', function (event) {
this.click();
event.stopPropagation();//阻止li事件的点击
});

wugezi
关注
专栏目录
MUI-LIST列表的基本使用
知他人之所知，晓他人之不晓。
11-05 3万+
列表是常用的UI控件，mui封装的列表组件比较简单，只需要在ul节点上添加.mui-table-view类、在li节点上添加.mui-table-view-cell类即可，如下为示例代码 class="mui-table-view"> class="mui-table-view-cell">Item 1 class="mui-table-view-cell">Item 2 cl
MUI列表条目点击事件代码
03-04
本项目是MUI列表条目点击事件的示例代码，目的是让大家了解MUI的点击事件该怎么写。
mui无法滚动？这里是解决办法之一
竹亦叶同的博客
04-18 1922
这里不是故意抄文档，但确实是方法 鄙人用mui,但是发现无法滚动！ 最终认真看文档解决问题！！！！ 以下是文档内容↓↓↓ 文档后有个人一点小解析 scroll(区域滚动) 在App开发中，div区域滚动的需求是普遍存在的，但系统默认实现又有如下问题： Android平台4.0以下不支持div滚动 Android平台4.0以上支持div滚动，但不显示滚动条 弹出层的div滚动在iOS平台存在事件透...
MUI列表条目的点击事件
qq_36317441的博客
03-04 7202
如下图所示是一个列表，我们想做的就是给这些条目写点击事件，之前百度了一下MUI的条目点击事件，找到的代码都是片段性，不太完整，而且我自己试了一下网上的代码感觉不奏效，也可能是我使用的方法不对吧，回来我自己摸索出了方法，在这里和大家分享一下。核心代码如下图所示：<script src="js/mui.min.js"></script> <script type="t...
mui点击添加类名_移动端，ajax 动态加载的元素，为动态添加的一系列同个类名的元素添加点击事件...
weixin_39882589的博客
12-21 231
背景：一个列表页，有一系列同类名的元素，需要为每一个动态添加的列表项添加事件；点击选择下图中不同的文档类型，再通过 ajax 动态加载不同的文档。使用过的方法：1、通知 jquery 的 $(selector).on('click',function(){}) 在动态添加元素的后一步执行，此段代码是在 ajax 内部，如下：$(".task-doc-list").append(tempStr);$...
mui点击事件失效
大海无量的博客
01-31 6943
                $('ul').on('click','li',function(){                                          console.log("2.点击lu中的li");                     //alert("2.点击lu中的li");                     var topicId=$(thi...
mui及索引列表indexedList,mui.picker.有索引列表具体教程
05-30
首先需要引入相关的CSS和JS文件，然后在HTML结构中设置相应的元素，包括`<div class="mui-indexed-list-indicator">`作为索引栏，以及`<ul class="mui-table-view mui-indexed-list">`作为数据列表。每个列表项需要...
MUI 解决动态列表页图片懒加载再次加载不成功的bug问题
01-19
在项目开发中遇到这样的功能，要求实现列表页动态加载功能，在实现过程中遇到一些小小插曲，下面小编给大家详细说明下解决方法： 首次加载时图片可以获取成功，再次加载失败，通过chrome调试发现img 的 data-lazy...
Angular中ng-repeat与ul li的多层嵌套重复问题
12-29
学习ng-repeat的过程中常常使用到ng-repeat=”item in array”来循环输出所需要的元素，但是当我们需要使用ng-repeat进行多层嵌套时则容易出现数据重复的问题。 如在加载与点击事件于js中进行两次http请求获取data...
【mui】html-mui-css-底部弹框
jieweiwujie的博客
08-30 405
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <title></title> <script...
引用MUI框架时，给组件绑定 click()或tap事件，会连续触发两次导致显示异常的解决办法？
verylonglongago的博客
09-26 2659
【已解决】这是由于连续引用了两次 mui.min.js（或mui.js） 导致，保证在自定义的 JavaScript代码段之前，只引用过一次mui.min.js（或mui.js） 即可！
confirm怎么防止重复点击 mui_【报Bug】mui.confirm 连续点击确定会执行多次
weixin_39795292的博客
01-17 806
详细问题描述[内容]mui原生UI组件 dialog中的confirm 确认按钮连续点击会多次触发确认中执行的方法重现步骤[步骤][结果][期望]运行环境[系统版本][浏览器版本][IDE版本][mui版本]v3.7.0附件[代码片段]html:js:var i = 0;var btnArray = ['否', '是'];mui.confirm('MUI是个好框架，确认？', 'Hello MUI...
MUI on绑定事件多次执行问题
iwusan
10-25 4654
1.可能是同时引用mui.js与mui.min.js; 2.可能多次注册了on事件，解决方法如下： //绑定前先注销事件 mui("li").off("tap"); //绑定事件 mui("li").on("tap", "p", function(e) { })  ...
HBuilder动态的向<ul></ul>中插入<li></li>
u012431404的博客
07-25 9609
1、父级ul  mui-table-view mui-table-view-striped mui-table-view-condensed" style="margin-bottom: 50px;">   2.动态添加li  //自我理解，就是获取这个容器，你想要往哪个容器放li  var table = document.body.querySelector('.mui-tabl
confirm怎么防止重复点击 mui_layer.confirm快速多次点击会重复触发事件问题
weixin_32534669的博客
01-17 289
function a () {console.log("请求开始---");var lock=false;//默认未锁定var myconfirm=layer.confirm('是否确认?',{btn: ['确定','取消']},function(index){console.log(lock);if(!lock){lock=true;//锁定//发送ajax$.ajax({url: '/../...
【网寻】mui - 点击事件
weixin_33670786的博客
07-26 117
//本来是需要这样的，结果点击无响应 $(".mui-control-item").on("click",function(event){ alert(1) }); //换成以下就可以了，$(".top-menu-list") 为本来的事件源的父级,此父级需要是一开始就存在的dom结构，而非动态添加 $(".top-menu-li...
MUI刷新问题
qq_36800701的博客
01-03 2181
MUI的刷新提供了上拉刷新和下拉刷新两种模式，其实说到底都是差不多的；不过这两种模式下又分了单webView模式和双webView模式，各有好处，官方文档都要做说明; 不过建议，不管什么情况下，刷新的DOM结构最好如下，会避免很多的兼容问题<!--刷新容器--> <div id="随便取" class="mui-content mui-scroll-wrapper"> <div class="
mui.openwindow打开新页面时一直刷新但不跳转的巨坑！！！
风云的博客
01-10 2526
现象：按钮点击，出发mui.openwindow 打开新页面，新页面数据执行，但是页面一直显示在加载，不展示。 原因：点击的按钮写在了form表单里面，点击时，form执行提交导致的、、、、、、、、、、...
MUI移动端页面跳转
热门推荐
xuepan1994的博客
07-13 4万+
今天整理MUI移动端页面跳转的几种方法和遇到的不同的坑 先上设置button、label和a标签的代码： onclick="jumpToDetailView()" id="jumpToDetail">查看企业详情 this is a test label this is a test 跳转方法一：button类型使用onclick='',函数
mui中button按钮一点击会变颜色
最新发布
01-06
在 MUI 中，Button 按钮是一种常见的用户交互元素，我们可以通过简单的代码实现按钮点击后变色的效果。 要实现按钮点击后变色，我们可以使用 MUI 提供的属性和样式。 首先，我们需要为按钮添加 onClick 属性，将点击事件与相应的处理函数关联起来。在处理函数中，我们可以使用 state 来控制按钮的颜色。 ```jsx import React, { useState } from 'react'; import Button from '@mui/material/Button'; const MyButton = () => { const [buttonColor, setButtonColor] = useState('primary'); const handleClick = () => { // 在点击事件中修改按钮的颜色 setButtonColor('secondary'); }; return ( <Button color={buttonColor} onClick={handleClick}> 我是按钮 </Button> ); }; ``` 在上述代码中，我们创建了一个名为 `MyButton` 的组件。使用 `useState` 钩子函数创建了一个 `buttonColor` 状态变量，并将其初始值设置为 `primary`。 然后，我们创建了一个名为 `handleClick` 的点击事件处理函数。在该函数中，我们通过调用 `setButtonColor` 更新 state 来将按钮的颜色修改为 `secondary`。 最后，在组件的返回部分，我们使用 MUI 的 Button 组件，并将 `color` 属性绑定到 `buttonColor` 变量，将按钮的颜色设置为 `primary` 或 `secondary`。 这样，当按钮被点击时，它的颜色将变为 `secondary`。 以上就是一种简单的使用 MUI 实现按钮点击变色的方法。当然，你也可以根据自己的需求自定义按钮样式，并根据实际情况调整按钮颜色的变化逻辑。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值