MUI返回父页面刷新功能实现

一 头文件引用

<script type="text/javascript" src="js/mui.js"></script>

二 子页面代码

定义 beforeback,放到<head>中

<script type="text/javascript" charset="utf-8">
    mui.init(
        {
            beforeback: function () {
                // 获得父页面的webview
                var list = plus.webview.currentWebview().opener();
                // 触发父页面的自定义事件(refresh),从而进行刷新
                mui.fire(list, 'refresh', null);
                // 返回true,继续页面关闭逻辑
                return true;
            }
        }
    );
</script>

2 调用方式1:点击 mui-action-back 控件,会触发返回

<div id="register" style="background: #fafafa;">
    <header class="mui-bar mui-bar-nav">
        <span class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" id="idCardImgBack">返回</span>
        <h1 class="mui-title">测试返回</h1>
    </header>
</div>

3 调用方式2:使用 mui.back() 编程式返回。

mui.back();

三 父页面代码

1 放到js代码的最上面,监听 refresh 事件

<script type="text/javascript">
    window.addEventListener('refresh', function (e) {//执行刷新
        debugger;
        window.location.reload();
    });
</script>

四 注意事项

因为涉及底层plus调用,所以一定要用真机进行测试。

五 Chrome真机调试方法

https://www.jianshu.com/p/7c142ba59c21

chrome://inspect/#devices

猜你喜欢

转载自blog.csdn.net/chengqiuming/article/details/109058551