仔细看，Alert函数执行了两次

共两个页面：index.html和detail.html,

detail.html为按钮设置了自定义事件监听(newsId)，触发alert.

在index.html点击按钮就会触发事件newsId,并用mui.openWindow()打开detail.html页面。

然后我有两个问题：

1. 就是上面提到的alert执行两次？

2. 就是有时候点击按钮并不会有任何操作，是文档没有加载完毕可能，有什么解决方法吗？

具体代码如下：

// ---index.html

<body>

    <header class="mui-bar mui-bar-nav">

            <h1 class="mui-title">新闻页面</h1>

    </header>

    <div class="mui-content">

        <a id="pen" class="mui-btn mui-btn-blue">钢笔事件</a>

        <a id="book" class="mui-btn mui-btn-blue">书籍事件</a>

        <a id="teacher" class="mui-btn mui-btn-blue">教师事件</a>

    </div>

    <script src="js/mui.min.js"></script>

    <script type="text/javascript" charset="utf-8">

        mui.init({

            //初始化预加载详情页面

            preloadPages:[{

                id:'detail.html',

                url:'detail.html'

            }]

        });

        mui.plusReady(function () {

           alert('plusReady()执行成功!');

        });

        var detailPage = null;

        // 添加列表项的点击事件

        mui('.mui-content').on('tap','a',function(e) {

            var id = this.getAttribute('id');

            //获得详情页面

            if(!detailPage) {

                detailPage = plus.webview.getWebviewById('detail.html');

            }

            //触发详情页面的newsId事件

            mui.fire(detailPage,'newsId',{

                id:id

            });

            //打开详情页面

            mui.openWindow({

                id:'detail.html'

            });

        });

    </script>

</body>

//---detail.html

<body>

        <header class="mui-bar mui-bar-nav">

            <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>

            <h1 class="mui-title">详情页</h1>

        </header>

        <div class="mui-content">

            <div id="showId"></div>

            <div class="mui-bar-footer mui-bar mui-text-center"><a class="mui-btn mui-btn-blue">回到新闻页</a></div>

        </div>

        <script src="js/mui.min.js"></script>

        <script type="text/javascript">

            mui.init();

            //添加newsId自定义时间监听

            window.addEventListener('newsId',function(event){

                //获得事件参数

                var id = event.detail.id;

                //将id显示在详情页上

                alert(id);  // 会出现两次是为什么？

                var showId = document.getElementById('showId');

                showId.innerText = id;

            });

            //添加列表点击事件

            mui('.mui-content').on('tap', 'a', function(e){

                mui.openWindow({

                    url:'index.html',

                    id:'index.html',

                    createNew:true       //重新出发index.html页面的plusReady()函数

                });

            });

        </script>

    </body>

　　

------待解决--------

[问题贴]mui.openWindow+自定义事件监听操作让alert()执行两次的更多相关文章

  1. Java Spring 自定义事件监听

    ApplicationContext 事件 定义一个context的起动监听事件 import org.springframework.context.ApplicationListener; imp ...

  2. cocos2d-js 自定义事件监听派发

    熟悉js的dom事件或者flash事件的,基本都能立马明白cc.eventManager的用法. cc.eventManager有两种注册监听器的方式,一种是原生事件,例如 cc.eventManag ...

  3. clipboard 在 vue 项目中，on 事件监听回调多次执行

    clipboard 定义一个全局变量 import ClipboardJS from "clipboard"; if(clipboard){ clipboard.destroy() ...

  4. JAVA自定义事件监听完整例子---sunfruit[转]

    http://cache.baiducontent.com/c?m=9f65cb4a8c8507ed4fece763105392230e54f733628a854d2c90c05f9313071601 ...

  5. Spring Boot实践——事件监听

    借鉴:https://blog.csdn.net/Harry_ZH_Wang/article/details/79691994 https://blog.csdn.net/ignorewho/arti ...

  6. SpringBoot框架(6)--事件监听

    一.场景:类与类之间的消息通信,例如创建一个对象前后做拦截,日志等等相应的事件处理. 二.事件监听步骤 (1)自定义事件继承ApplicationEvent抽象类 (2)自定义事件监听器,一般实现Ap ...

  7. Zookeeper Curator 事件监听 - 秒懂

    目录 写在前面 1.1. Curator 事件监听 1.1.1. Watcher 标准的事件处理器 1.1.2. NodeCache 节点缓存的监听 1.1.3. PathChildrenCache ...

  8. spring事件监听（eventListener)

    原理:观察者模式 spring的事件监听有三个部分组成,事件(ApplicationEvent).监听器(ApplicationListener)和事件发布操作. 事件 事件类需要继承Applicat ...

  9. 关于实现自定义Dialog和实现Dialog里view的事件监听的两种方法

    一.自定义dialog. 二.实现dialog里view的事件监听 1.自定义dialog比较简单.在实例化new的时候,加入样式,布局就行了.或者重写dialog. 2.实现dialog里view的 ...

随机推荐

  1. 4日6日--ES5新增数组方法

    forEach使用的函数调用,所以占内存比较大,不如定长for循环和迭代for循环 1.通过forEach将数组中的元素逐个表示出来(遍历方法,读取操作). 2.通过map将原数组中的元素进行算数运算 ...

  2. zookeeper入门与实践

    概述 Zookeeper是Hadoop的一个子项目,它是分布式系统中的协调系统,可提供的服务主要有:配置服务.名字服务.分布式同步.组服务等. 它有如下的一些特点: 简单 Zookeeper的核心是一 ...

  3. 现代3D图形编程学习-设置三角形颜色(译)

    本书系列 现代3D图形变成学习 http://www.cnblogs.com/grass-and-moon/category/920962.html 设置颜色 这一章会对上一章中绘制的三角形进行颜色的 ...

  4. 倒排索引的AND操作

    这是一道来自百度的面试题.倒排索引的AND操作. 倒排索引是以关键词作为索引项来索引文档的一种机制,如图中Brutus.Calpurnia.Caesar为关键词,2.4.8等等为文档ID. 现在有一个 ...

  5. 线段树（hdu 1556）

    Problem Description: N个气球排成一排,从左到右依次编号为1,2,3....N.每次给定2个整数a b(a <= b),lele便为骑上他的"小飞鸽"牌电 ...

  6. Android 开源优秀的项目

    webrtc square/picasso  Android 的一个强大的图像下载和缓存库 A powerful image downloading and caching library for A ...

  7. CF Educational Codeforces Round 3 E. Minimum spanning tree for each edge 最小生成树变种

    题目链接:http://codeforces.com/problemset/problem/609/E 大致就是有一棵树,对于每一条边,询问包含这条边,最小的一个生成树的权值. 做法就是先求一次最小生 ...

  8. 浩哥解析MyBatis源码（十二）——binding绑定模块之MapperRegisty

    原创作品,可以转载,但是请标注出处地址:http://www.cnblogs.com/V1haoge/p/6758456.html 1.回顾 之前解析了解析模块parsing,其实所谓的解析模块就是为 ...

  9. Linux-进程描述（4）之进程优先级与进程创建执行

    进程优先级 进程cpu资源分配就是指进程的优先权(priority).优先权高的进程有优先执行权利. 权限与优先级.权限(privilege)是指在多用户计算机系统的管理中,某个特定的用户具有特定的系 ...

  10. 使用RandomAccessFile在两个java进程之间传递数据

    大部分情况下,我们面对在两个java进程只见传递数据的问题时,第一个想到的就是开server,然后通过socket收发消息.这方面有大量的框架可用,就不细说了.但如果两个进程是在一台机器上,那么还可以 ...