引用
样式表: mui.min.css
Js：mui.min.js
常用功能
获取页面
var webView=plus.webview.currentWebview();//获取当前页
var webView=plus.webview.currentWebview().opener();//获取上一页的页面
var webView= plus.webview.currentWebview().parent();//获取父级页面
var webView =plus.webview.getWebviewById("index");//根据Id获取页面
var webView = plus.webview.getLaunchWebview();//获取主页面
var all = plus.webview.all();//获取所有页面
webViewObj.reload(true);//刷新页面
自定义返回事件
返回：mui.back()，可在点击事件里添加
Beforeback：自定义返回按钮事件，如果要禁用返回时间添加 return false;
1 <script type="text/javascript">
2 (function($, doc) {
3
4 mui.init({
5
6 beforeback: function() {
7
8 var webView = plus.webview.currentWebview();
9
10 var pWebView = webView.opener();
11
12 $.fire(pWebView, "breck_page");
13
14 return false;
15
16 }
17
18 });
19
20 $.plusReady(function() {});
21
22 }(mui, document));
23 </script>
打开页面/关闭页面
打开页面时用mui. openWindow()方法，url:打开页面路径，id：页面Id、styles：页面样式、extras：参数（从A打开B页面在B页面可以取到该参数,）
1 <script type="text/javascript">
2
3 (function($, doc) {
4
5 mui.init();
6
7 $.plusReady(function() {
8
9 $.openWindow({
10
11 url: "course_info.html",
12
13 id: "course_info.html",
14
15 styles:{ top:"50px"}
16
17 extras: {
18
19 courseId: courseId
20
21 },
22 })
23 });
24 }(mui, document));
25
26 </script>
关闭页面webViewObj.close(“slide-out-bottom”,300);参数1：关闭动画，参数2：动画时间
接收参数
- 获取当前页面 var webView = plus.webview.currentWebview();
- 获取content字符串 var content= webView.content;
- 获取当前序号,要取int型需要进行转换 var index= parseInt(webView.index);
预加载页面
方式一：
通过mui.init方法中的preloadPages参数进行配置.
1 mui.init({
2
3 preloadPages:[
4
5 {
6
7 url:prelaod-page-url,
8
9 id:preload-page-id,
10
11 styles:{},//窗口参数
12
13 extras:{},//自定义扩展参数
14
15 subpages:[{},{}]//预加载页面的子页面
16
17 }
18
19 ],
20
21 preloadLimit:5//预加载窗口数量限制(一旦超出,先进先出)默认不限制
22
23 });
该种方案使用简单、可预加载多个页面，但不会返回预加载每个页面的引用，若要获得对应webview引用，还需要通过plus.webview.getWebviewById方式获得；另外，因为mui.init是异步执行，执行完mui.init方法后立即获得对应webview引用，可能会失败，例如如下代码：
mui.init({
preloadPages:[
{
url:'list.html',
id:'list'
}
]
});
var list = plus.webview.getWebviewByid('list');//这里可能返回空；
方式二：通过mui.preload方法预加载.
1 <script type="text/javascript">
2 (function ($, doc) {
3 mui.init();
4 $.plusReady(function () {
5 mui.preload({
6 url: 'test_select_info.html',
7 id: page_id,
8 styles: {},
9 extras: {},
10 });
11 page.show("none");
12 });
13 }(mui, document));
14 </script>
自定义事件
window.addEventListener(EventName,function(){});
EventName:事件名称
Function(){}:时间内容
B页面调取A页面的自定义事件
mui.fire(webViewObj, EventName);
webViewObj: 目标页面（类型obj）
EventName：事件名称（类型string）
异步获取数据
1 Var url=” http://www.zfgo360.com/App/Home/Index”
2
3 mui.ajax(url, {
4
5 data: loginInfo,
6
7 dataType: 'json', //服务器返回json格式数据
8
9 type: 'post', //HTTP请求类型
10
11 timeout: 10000, //超时时间设置为10秒；
12
13 success: function(data) {
14
15 if(data.code == 0) //登录成功将数据存入本地
16
17 {
18
19 } else {
20 }
21
22 },
23 error: function(xhr, type, errorThrown) {
24 console.log(errorThrown);
25 }
26 });
确认事件
1 var btnArray = ['是','否' ];
2 var pageurl=nowPage.getURL();
3 $.confirm('您确定要结束当前练习?', '温馨提示', btnArray, function(e) {
4 if (e.index == 0) {
5 //点击是时触发
6 }
7 else{
8 //点击否时触发
9 }
10 })
添加子页面
mui.init({
subpages:[{
url:your-subpage-url,//子页面HTML地址，支持本地地址和网络地址
id:your-subpage-id,//子页面标志
styles:{
top:subpage-top-position,//子页面顶部位置
bottom:subpage-bottom-position,//子页面底部位置
width:subpage-width,//子页面宽度，默认为100%
height:subpage-height,//子页面高度，默认为100%
......
},
extras:{}//额外扩展参数
}]
});
在有些情况下不能在mui.init()里添加子页面需要在页面加载之后添加子页面
Var webView= plus.webview.currentWebview();//获取当前页
var sub = plus.webview.create(pageId, subpages[i].id, styles, extras); //创建子页面
webView.append(sub);给当前页添加子页面
上拉刷新下拉加载
添加引用
1 <script type="text/javascript" src="../../js/mui.pullToRefresh.js"></script>
2 <script type="text/javascript" src="../../js/mui.pullToRefresh.material.js"></script>
3 <script type="text/javascript">
4 (function($, doc) {
5 mui.init();
6 $.plusReady(function() {
7 Var pullToRefresh = mui("#pullrefresh").pullToRefresh({
8 down: {
9 callback: function() {
10 //下拉刷新事件
11 pullToRefresh.endPullDownToRefresh();//结束下拉刷新事件
12 }
13 },
14 up: {
15 callback: function() {
16 //上拉加载事件
17 pullToRefresh.endPullUpToRefresh();//结束上拉加载事件
18 }
19 }
20 });
21 });
22 }(mui, document));
23 </script>
点击事件
1 document.getElementById("id").addEventListener(“tap”,function(){
2 //事件代码
3 });
4 //或者
5 mui('#pano-list').on('tap', '.recommend-item',function(){
6 //事件代码
7 });
事件触发
使用mui.trigger()方法可以动态触发特定DOM元素上的事件。
自动触发按钮的点击事件：
1 var btn = document.getElementById("submit");
2
3 //监听点击事件
4
5 btn.addEventListener("tap",function () {
6
7 console.log("tap event trigger");
8
9 });
10
11 //触发submit按钮的点击事件
12
13 mui.trigger(btn,'tap');
使用Native.js实现打开页面默认弹出软键盘
1 var nativeWebview, imm, InputMethodManager;
2
3 var initNativeObjects = function() {
4
5 if (mui.os.android) {
6
7 var main = plus.android.runtimeMainActivity();
8
9 var Context = plus.android.importClass("android.content.Context");
10
11 InputMethodManager = plus.android.importClass("android.view.inputmethod.InputMethodManager");
12
13 imm = main.getSystemService(Context.INPUT_METHOD_SERVICE);
14
15 } else {
16
17 nativeWebview = plus.webview.currentWebview().nativeInstanceObject();
18
19 }
20
21 };
22
23 var showSoftInput = function() {
24
25 var nativeWebview = plus.webview.currentWebview().nativeInstanceObject();
26
27 if (mui.os.android) {
28
29 //强制当前webview获得焦点
30
31 plus.android.importClass(nativeWebview);
32
33 nativeWebview.requestFocus();
34
35 imm.toggleSoftInput(0, InputMethodManager.SHOW_FORCED);
36
37 } else {
38
39 nativeWebview.plusCallMethod({
40
41 "setKeyboardDisplayRequiresUserAction": false
42
43 });
44
45 }
46
47 setTimeout(function() {
48
49 //此处可写具体逻辑设置获取焦点的input
50
51 var inputElem = document.querySelector('input');
52
53 inputElem.focus();
54
55 }, 200);
56
57 };
58
59 mui.plusReady(function() {
60
61 initNativeObjects();
62
63 showSoftInput();
64
65 });
微信支付首次支付成功，后面支付报-1错误
这个是签名生成工具：
应用签名的修改位置：
开放平台-->管理中心(页面顶部)-->移动应用(左上角)-->点击查看按钮-->跳转到应用详情页面，
在页面末尾有个开发信息，然后点击修改。
签名修改后，要过一段时间才会生效，我过了10分钟左右。
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
