mui自定义事件实例
监听自定义事件(接收页面应用)
添加自定义事件监听操作和标准js事件监听类似,可直接通过window对象添加,如下:
window.addEventListener('customEvent',function(event){
//通过event.detail可获得传递过来的参数内容
....
});
触发自定义事件(传参页面应用)
通过mui.fire()方法可触发目标窗口的自定义事件:
参数
target
Type: WebviewObject
需传值的目标webview
event
Type: String
自定义事件名称
data
Type: JSON
json格式的数据
自定义事件完整例子
传参页面:
<div class="mui-content">
<ul id="list1">
<li id="1">新闻1</li>
<li id="2">新闻2</li>
<li id="3">新闻3</li>
</ul>
</div>
</body>
<script type="text/javascript">
mui.init();
mui.plusReady(function(){
var detailPage = mui.preload({url:'sub.html',id:'sub.html'});
mui('#list1').on('tap', 'li', function(e){
mui.fire(detailPage,'newsId',{id:this.getAttribute('id')});
mui.openWindow({id:'sub.html'});
});
});
</script>
接收页面
mui.plusReady(function(){
window.addEventListener('newsId',function(event){//这里的newsId是自定义事件的事件名称
console.log(event.detail.id); }); });