preload_home.html(預加載的首頁)
<!doctype html> <html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <link href="css/mui.min.css" rel="stylesheet" /> </head> <body> <button type="button" id="btn_open">打開預加載的頁面</button> <script src="js/mui.min.js"></script> <script type="text/javascript"> mui.init(); var page = null; mui.plusReady(function() { //預加載頁面mui.preload必須放在plusReady事件中 page = mui.preload({ url: 'preload_sub.html', id: 'preload_sub', extras: { name: 'durant' } }); }) document.getElementById("btn_open").addEventListener('tap', function() { //預加載僅會提前創建webview,並不會默認打開,因此需要再使用mui.openWindow方法打開對應窗口,才會看到預加載效果。 if(page) { //方法1:直接調用預加載頁面對象page的show方法 //page.show(); //方法2:mui.openWindow //mui.openWindow('preload_sub');//簡寫,通過ID打開指定頁面 mui.openWindow({ url: 'preload_sub.html', id: 'preload_sub' }) //亦可寫詳細的參數 //方法3:getWebviewById(),通過ID找到webview,再調用show()方法 //var wv = plus.webview.getWebviewById('preload_sub'); //請在plus ready后再調用plus api,不一定非得寫在plusReady事件中 //console.log(page == wv) //true,page就是'preload_sub'所對應的webview //wv.show(); } }) </script> </body> </html>
preload_sub.html(預加載的頁面)
<!doctype html> <html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <link href="css/mui.min.css" rel="stylesheet" /> </head> <body> <div id="div1"></div> <script src="js/mui.min.js"></script> <script type="text/javascript"> mui.init(); // window.onload=function(){ mui.plusReady(function() { var self = plus.webview.currentWebview(); document.getElementById("div1").innerText = 'hi,' + self.name; }) // } </script> </body> </html>