mui 内部打开第三方链接、页面

2020-11-18  本文已影响0人  可乐_加冰_

父级页面点击某个元素,打开新的页面。

①第一种方案

父级页面代码:
document.getElementById('weather').addEventListener('tap', function() {
        mui.openWindow({
            url: "weatherView.html?url=" +"https://xw.tianqi.qq.com/",
            id: "weather",
            styles:{
                top: '45px',//新页面顶部位置
            },
            waiting: {
                autoShow: true,
                title: '加载中...',
            },
        });
    });
weatherView.html 子页面:
<header class="mui-bar mui-bar-nav" >
    <span class="mui-icon mui-icon-arrowleft" id="back_to_msg_list" style="padding-left: 6px;"></span>
    <h1 class="mui-title">天气信息</h1>
</header>

<script>
    var str = window.location.search;
    var url = str.substring(str.indexOf('=') + 1);//获取当前打开链接中所带参数值
    mui.init();
    mui.plusReady(function() {
        var self = plus.webview.currentWebview();
        var view = plus.webview.create(url, "weather", {
            top: "45px", //页面距离高度
            bottom: 0,
        });
        self.append(view);
    });

    document.getElementById('back_to_msg_list').addEventListener('tap', function () {
        mui.back()
    });
</script>


②第二种方案

父级页面代码:
document.getElementById('weather').addEventListener('tap', function() {
        mui.openWindow({
            url: "weatherView.html?",
            id: "weather",
            styles:{
                top: '45px',//新页面顶部位置
            },
            waiting: {
                autoShow: true,
                title: '加载中...',
            },
            extras: {
                viewHref:'https://xw.tianqi.qq.com/'
            }
        });
    });
weatherView.html 子页面:
<header class="mui-bar mui-bar-nav" >
    <span class="mui-icon mui-icon-arrowleft" id="back_to_msg_list" style="padding-left: 6px;"></span>
    <h1 class="mui-title">天气信息</h1>
</header>

<script>
    mui.init();
    mui.plusReady(function() {
        var url = plus.webview.currentWebview().viewHref;
        var self = plus.webview.currentWebview();
        var view = plus.webview.create(url, "weather", {
            //这里定义页面高度
            top: "45px",
            bottom: 0,
        });
        self.append(view);
    });

    document.getElementById('back_to_msg_list').addEventListener('tap', function () {
        mui.back()
    });
</script>

上一篇下一篇

猜你喜欢

热点阅读