mui 进度条 隐藏
官方提供的 mui(contanier).progressbar().hide(); 并未起作用,DOM是js动态添加的,结果无法隐藏。(越使用,mui 的坑越多,陆续记录中...)
后使用下面的方法,将进度条隐藏了。原理是去掉由 mui-progressbar 类而生成的进度条样式。
var isProgress = $("#progressBar").hasClass("mui-progressbar");
if(isProgress) {
$("#progressBar").removeClass("mui-progressbar")
}
修正上述所说:
上面所说方法也可以隐藏进度条,但官方提供的 hide() 方法,也是可以的。但需要注意,所说的动态,非动态将 DOM 结构用 JS 添加,例如:
$("#progressBar").append("<div class='mui-progressbar'><span></span></div>");
我一开始便是如此理解“动态创建”,于是就无法直接使用 mui("#progressBar").progressbar().hide(); 进行隐藏。
之后查看官方demo (地址:http://www.dcloud.io/hellomui/examples/progressbar.html),使用下文代码,即可正常使用 mui("#progressBar").progressbar().hide(); 隐藏了。
let proVal = 0;//用来模拟进度的数值
document.getElementById("progressBtn").addEventListener("tap", function() {
mui("#progressBar").progressbar({
progress: proVal
}).show(); }, false); setInterval(function() {
proVal += 4;
setProgress()
if(proVal > 100) {
//disposeProgress()
mui("#progressBar").progressbar().hide();
proVal = 0;
}
}, 500); function setProgress() {
mui("#progressBar").progressbar().setProgress(proVal)
}
源网址:https://segmentfault.com/a/1190000011129041
mui 进度条 隐藏的更多相关文章
- ajax 上传文件,显示进度条,进度条100%,进度条隐藏,出现卡顿就隐藏进度条,显示正在加载,再显示上传完成
<form id="uploadForm" method="post" enctype="multipart/form-data"&g ...
- android:异步任务asyncTask介绍及异步任务下载图片(带进度条)
为什么要用异步任务? 在android中仅仅有在主线程才干对ui进行更新操作.而其他线程不能直接对ui进行操作 android本身是一个多线程的操作系统,我们不能把全部的操作都放在主线程中操作 .比方 ...
- ASP.NET中二进制流下载文件时进度条的使用
说明 在下载大文件时,页面会进入假死状态,于是加上一个进度条以标识后台程序正在运行. 目前,做的进度条并不是实时的,并不会根据程序执行的进度正确显示. 目前是将进度条定时加载到90%,然后停止,等待后 ...
- mui 滑块开关 进度条 以及如何获取值
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...
- Android 显示或隐藏标题栏进度条TitleProgressBar
1.新建项目,布局文件如下:activity_main.xml <LinearLayout xmlns:android="http://schemas.android.com/apk/ ...
- LODOP打印URL显示和隐藏进度条
不建议使用ADD_PRINT_URL:由于Lodop借用IE下载引擎,与非IE浏览器之间目前不能传递Session(Cookies),所以需要安全验证的页面不要用URL方式打印,要用页面已经下载好的内 ...
- js点击什么显示什么的内容,隐藏其它和进度条
点击什么显示什么的内容 <div style="width:200px; height:40px"> <div class="yiji" st ...
- Android -- 真正的 高仿微信 打开网页的进度条效果
(本博客为原创,http://www.cnblogs.com/linguanh/) 目录: 一,为什么说是真正的高仿? 二,为什么要搞缓慢效果? 三,我的实现思路 四,代码,内含注释 五,使用方法与截 ...
- css3圆形百分比进度条的实现原理
原文地址:css3圆形百分比进度条的实现原理 今天早上起来在查看jquery插件机制的时候,一不小心点进了css3圆形百分比进度条的相关文章,于是一发不可收拾,开始折腾了... 关于圆形圈的实现,想必 ...
随机推荐
- HTML连载62-固定定位练习、z-index属性
一.固定定位应用场景 1.练习 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
- Tensorflow中one_hot() 函数用法
官网默认定义如下: one_hot(indices, depth, on_value=None, off_value=None, axis=None, dtype=None, name=None) 该 ...
- webscarab
1.功能 WebScarab是一个用来分析使用HTTP和HTTPS协议的应用程序框架.其原理很简单,WebScarab可以记录它检测到的会话内容(请求和应答),并允许使用者可以通过多种形式来查看记录. ...
- pip install时报错
因为需要mysqlclient这个模块,但是在pip的时候报错 Collecting mysqlclient Using cached https://files.pythonhosted.org/ ...
- Request继承体系
ServletRequest——接口 ↑继承 HttpServletRequest——接口 ↑实现 org.apache.catalina.connector.RequestFacade——类(Tom ...
- .net c# MVC提交表单的4种方法
https://blog.csdn.net/qingkaqingka/article/details/85047781
- AcWing 803. 区间合并
#include <iostream> #include <vector> #include <algorithm> using namespace std; ty ...
- Apache Kafka(四)- 使用 Java 访问 Kafka
1. Produer 1.1. 基本 Producer 首先使用 maven 构建相关依赖,这里我们服务器kafka 版本为 2.12-2.3.0,pom.xml 文件为: <?xml vers ...
- 题解【CJOJ1070/UVA】嵌套矩形
P1070 - [Uva]嵌套矩形 Description 有 n 个矩形,每个矩形可以用两个整数 a, b 描述,表示它的长和宽.矩形 X(a, b) 可以嵌套在矩形 Y(c, d) 中当且仅当 a ...
- [lua]紫猫lua教程-命令宝典-L1-01-07. table表
L1[table]01. table表的定义与赋值 小知识:声明表的例子 xx={}--创建一个空表xx --给这表的元素赋值 test="a" xx[test]="a& ...