一、alert告警框

用法 .alert(message,title,btnvalue,callback[,type]);

document.getElementById("noclick").addEventListener('tap', function() {
mui.alert("欢迎使用Hello MUI", "Hello MUI","确定关闭", function() {
mui.alert("你刚关闭了警告框","操作提示","确定");
});
});

二、comfirm对话框

用法.confirm(message,title,btnvalue,callback[,type]);

document.getElementById("noclick").addEventListener("tap",function(){
  var btnarr=["确定","取消"];
  mui.confirm("你确定关闭对话框吗?","操作提示",btnarr,function(e){
     if(e.index == 0){
      mui.alert("你已关闭对话框!","操作提示","确定");
     }else{
mui.alert("你取消关闭对话框!","操作提示","确定");
     }
  });
});

  

三、提示框

用法.toast(message[,options]);

message:"string"消息框显示的文字内容;options:{JSON}提示消息的参数

duration:持续显示时间,默认值short(2000ms),支持整数值和string,string可选:long(3500ms),short(2000ms)

document.getElementById("noclick").addEventListener("tap",function(){
  mui.toast("欢迎体验MUI",{duration:3500,type:"div"});
});

四、prompt对话提示框

用法:.prompt(message,placeholder,title,btnvalue,callback[,type]);

document.getElementById("noclick").addEventListener("tap",function(){
  mui.prompt("你确定要关闭本窗口吗?","确定","操作提示",["确定","取消"],function(e){
  if(e.index == 0){
  mui.toast("你已关闭窗口");
  }else{
  mui.toast("你取消关闭窗口");
  }
  })
});

如果有定制对话框样式的需求(只能修改h5模式的对话框)可以再mui.css中修改.mui-popup类下的样式

	//修改弹出框默认input类型为password 
mui.prompt('text','deftext','title',['true','false'],null,'div') 
document.querySelector('.mui-popup-input input').type='password'

原文地址:https://blog.csdn.net/Ag_wenbi/article/details/73497639

MUI对话框使用的更多相关文章

  1. mui 对话框 点击按钮不关闭对话框的办法

    目前版本的 mui.js 点击对话框的按钮只能关闭对话框 做如下修改 点击按钮后return false 即可

  2. mui对话框、表单

    1.mui.alert() 普通提醒参数 1.message Type: String 提示对话框上显示的内容 2.title Type: String 提示对话框上显示的标题 3.btnValue ...

  3. mui对话框事件

    mui.confirm('生成成功,是否跳转到订单页面?','',['跳转','取消'],function(e){ if(e.index==0){ //点击跳转 }else if(e.index==1 ...

  4. 完美替换win8.1 x64默认雅黑为宋体方法

    由于显示器不好,安装win8.1 x64系统后,系统默认的雅黑字体实在是看不习惯, 时间稍一常眼睛就发累,还是一直用的xp宋体好,于是寻思着能不能将默认雅黑换成宋体. 网上倒是搜出了许多win7的修改 ...

  5. MUI(5)

    今天实现9宫格菜单.先上效果图: 就是这个效果咯,界面不太美观,底部导航栏是为了苹果用户没有返回按键设计的,只是为了方便演示而已,没有做过多的处理.首先先说一下这个底部导航栏如何实现,这个底部导航栏小 ...

  6. mui

    MUI + SDK 使用笔记:   MUI是什么:http://ask.dcloud.net.cn/article/91   /* MUI 使用说明: * * 1.每个用到mui的页面都调用下mui. ...

  7. mui开发webapp(2)

    前端开发APP,从HBuilder开始~ 序 通过 HTML5 开发移动App 时,会发现HTML5 很多能力不具备.为弥补HTML5 能力的不足,在W3C 中国的指导下成立了www.HTML5Plu ...

  8. MUI——页面的创建、显示、关闭

    一.打开子页面 mui.init({ subpages:[{ url:your-subpage-url,//子页面HTML地址,支持本地地址和网络地址 id:your-subpage-id,//子页面 ...

  9. mui开发app之webview是什么

    WebView(网络视图)能加载显示网页,可以将其视为一个浏览器,webview被封装在html5+,plus对象中,底层由java,OC实现. 先来谈谈我对webview的理解: 使用mui开发的a ...

随机推荐

  1. CentOS7下Docker与.net Core 2.2

    一.使用 yum 安装(CentOS 7下) Docker 要求 CentOS 系统的内核版本高于 3.10 ,查看本页面的前提条件来验证你的CentOS 版本是否支持 Docker . 通过 una ...

  2. POJ 2112 /// 最大流+floyd+二分

    题目大意: 有 k台挤奶机 和 c头奶牛 每台挤奶机最多为m头奶牛服务 给定所有挤奶机和奶牛两两之间的距离 求一种分配 使得 奶牛与挤奶机之间的最远距离 最小化 floyd求得所有挤奶机与奶牛两两之间 ...

  3. java并发编程之美-阅读记录11

    java并发编程实践 11.1ArrayBlockingQueue的使用 有关logback异步日志打印中的ArrayBlockingQueue的使用 1.异步日志打印模型概述 在高并发.高流量并且响 ...

  4. Vue小白篇 - ES6的语法

    为什么要学 ES6 的语法呢? 因为 Vue 语法有很多都是 ES6(ECMAScript 6),这里推荐 [阮一峰 ECMAScript 6 入门]: http://es6.ruanyifeng.c ...

  5. numpy 数组中添加新元素

    import numpy as npnew_array = np.empty(shape=[0, 3]) # 3列n行for i in range(10): x = i+1 y = i+2 z = i ...

  6. window.onload中失效的问题

    在页面中,我们有时候想让页面加载的时候有多个JS事件,一般的时候我们会这样做 window.onload=function(){ alert("aaa"); } window.on ...

  7. array_shift — 将数组开头的单元移出数组

    <?php $stack = array("orange", "banana", "apple", "raspberry&q ...

  8. PHP7.1以上版本 count()报错

    报错信息如下: count(): Parameter must be an array or an object that implements Countable (View: D:\fookusy ...

  9. mysql 获取任意一个月的所有天数。

    SELECT ADDDATE(y.first, x.d - 1) as dFROM(SELECT 1 AS d UNION ALLSELECT 2 UNION ALLSELECT 3 UNION AL ...

  10. POJ 2808 校门外的树(线段树入门)

    题目描述 某校大门外长度为L的马路上有一排树,每两棵相邻的树之间的间隔都是1米.我们可以把马路看成一个数轴,马路的一端在数轴0的位置,另一端在L的位置:数轴上的每个整数点,即0,1,2,……,L,都种 ...