mui---mui.fire触发自定义事件传事件对象中的参数

fire_event_send_page.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 id="btn_send" type="button" class="mui-btn mui-badge-danger">使用mui.fire触发自定义事件传递参数</button>
        <script src="js/mui.min.js"></script>
        <script type="text/javascript">
            mui.init();
            var ws=null;
            mui.plusReady(function  () {
                ws=plus.webview.create('fire_event_recieve_page.html','fire_event_recieve_page');
            });
            document.getElementById("btn_send").addEventListener('tap',function() {
                //'my_event'是自定义事件名称,name是事件参数 ,监听事件中回调用函数可用event.detail.name获取
                mui.fire(ws,'my_event',{name:'zyz'});
                ws.show();
            });
        </script>
    </body>

</html>

 

fire_event_recieve_page.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();
            //监听事件my_event
            window.addEventListener('my_event',function(event) {
                //event是事件对象,可以得到触发时的事件参数
                document.getElementById("div1").innerText='hi,'+event.detail.name;
            })
        </script>
    </body>

</html>

 

posted @ 2018-05-30 21:30  框框A  阅读(372)  评论(0编辑  收藏  举报