<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

    <title></title>

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

    <link href="css/mui.min.css" rel="stylesheet"/>

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

    /*提前预加载其他页面，这样再打开已加载好的页面就会有很好的效果了*/

          mui.init({

              preloadPages:[{

                  url :'tel.html',

                  id: "tel.html",

                  extras:{name:'小明', age:18}

              }]

          });

    </script>

</head>

<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">hello</h1>

</header>-->

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

    <a class="mui-tab-item mui-active">

        <span class="mui-icon mui-icon-home"></span>

        <span class="mui-tab-label">首页</span>

    </a>

    <a class="mui-tab-item" id="open_tel"><!--onclick="openTel()"-->

        <span class="mui-icon mui-icon-phone"></span>

        <span class="mui-tab-label">电话</span>

    </a>

    <a class="mui-tab-item">

        <span class="mui-icon mui-icon-email"></span>

        <span class="mui-tab-label">邮件</span>

    </a>

    <a class="mui-tab-item">

        <span class="mui-icon mui-icon-gear"></span>

        <span class="mui-tab-label">设置</span>

    </a>

</nav>

<div class="mui-content">

    <!--跳转链接可以用a链接-->

<!--    /*打开新页面的方式 1*/-->

    <a href="tel.html">打电话</a>

    <!--    /*打开新页面的方式 3*/-->

    <button type="button" onclick="tel()">打电话</button>

</div>

</body>

<script type="text/javascript">

    /*对页面初始化的方法  mui.plusReady(function(){})*/

    /*创建子页面， 以防数据多，出现卡顿的事情发生*/

    /*mui.init({

        subpages:[{

            url : 'list.html',

            id  : 'list.html',

            styles : {

                top: '200px',

                bottom: '0px'

            }

        }]

    })*/

    /*打开新页面的方式 2*/

    //跳转链接可以用原生组件

    /*mui.plusReady(function(){})*/

        document.getElementById('open_tel').addEventListener('tap',function(){

            mui.openWindow({

                url: 'tel.html',

                id: 'tel.html'

            })

        })

    /*打开新页面的方式 3*/

    //也可以自定义个onclick()点击事件

    //并且还可以传递值

    function tel(){

        mui.openWindow({

            url: 'tel.html',

            id: 'tel.html',

            extras: {name:'小明',age:18}

        })

    }

</script>

</html>

mui 窗口管理及窗口之间的数据传递的更多相关文章

  1. （转载）Javascript操作表单之间的数据传递

    (转载)http://www.aspxhome.com/javascript/skills/200710/214825.htm 今天有朋友问我关于用JAVASCRIPT来进行页面各表单之间的数据传递的 ...

  2. HTML5中window.postMessage，在两个页面之间的数据传递

    HTML5中window.postMessage,在两个页面之间的数据传递 2015年11月3日 8536次浏览 关于postMessage window.postMessage虽然说是html5的功 ...

  3. Vue 爬坑之路（二）—— 组件之间的数据传递

    Vue 的组件作用域都是孤立的,不允许在子组件的模板内直接引用父组件的数据.必须使用特定的方法才能实现组件之间的数据传递. 首先用 vue-cli 创建一个项目,其中 App.vue 是父组件,com ...

  4. 解决vue不相关组件之间的数据传递----vuex的学习笔记，解决报错this.$store.commit is not a function

    Vue的项目中,如果项目简单, 父子组件之间的数据传递可以使用  props 或者 $emit 等方式 进行传递 但是如果是大中型项目中,很多时候都需要在不相关的平行组件之间传递数据,并且很多数据需要 ...

  5. JSP、servlet、SQL三者之间的数据传递

    JSP.servlet.SQL三者之间的数据传递 博客分类: web开发 JSPservletSQL数据库连接池web开发  前言: 最近一直在做WEB开发,现总结一下这一段时间的体会和感触. 切记, ...

  6. （转）Vue 爬坑之路（二）—— 组件之间的数据传递

    Vue 的组件作用域都是孤立的,不允许在子组件的模板内直接引用父组件的数据.必须使用特定的方法才能实现组件之间的数据传递. 首先用 vue-cli 创建一个项目,其中 App.vue 是父组件,com ...

  7. ASP.NET MVC3中Controller与View之间的数据传递

    在ASP.NET MVC中,经常会在Controller与View之间传递数据,因此,熟练.灵活的掌握这两层之间的数据传递方法就非常重要.本文从两个方面进行探讨: 一.  Controller向Vie ...

  8. Activity之间的数据传递

    最常用的Activity之间的数据传递. btnStartAty1.setOnClickListener(new View.OnClickListener() { @Override public v ...

  9. ASP.NET MVC 之控制器与视图之间的数据传递

    今天,我们来谈谈控制器与视图之间的数据传递. 数据传递,指的是视图与控制器之间的交互,包括两个方向上的数据交互,一个是把控制器的数据传到视图中,在视图中如何显示数据,一个是把视图数据传递到控制器中, ...

  10. iOS开发中视图控制器ViewControllers之间的数据传递

    iOS开发中视图控制器ViewControllers之间的数据传递 这里我们用一个demo来说明ios是如何在视图控制器之间传递重要的参数的.本文先从手写UI来讨论,在下一篇文章中讨论在storybo ...

随机推荐

  1. 基于git命令的代码统计方法

    基于git命令的代码统计方法 没什么好说的,基于git log命令,使用前提是安装了git ...... .统计所有人代码量 统计所有人代码增删量,拷贝如下命令,直接在git bash等终端,git项 ...

  2. Win10远程桌面提示你的凭据不工作的处理方法

    需要确保在组策略编辑器(Win+R 输入 gpedit.msc )中计算机配置->Windows设置->安全设置->本地策略->安全选项->右侧的网络访问:本地帐户的共享 ...

  3. 一步步教你轻松学K-means聚类算法

    一步步教你轻松学K-means聚类算法(白宁超  2018年9月13日09:10:33) 导读:k-均值算法(英文:k-means clustering),属于比较常用的算法之一,文本首先介绍聚类的理 ...

  4. java 根据系统日期获取前一天、后一天时间(根据初始日期推算出期望（向前/向后）日期)

      1.情景展示  java 根据系统当前日期获取前一天日期.后一天日期,或者根据初始日期推算出期望(向前/向后)日期. 2.解决方案 导包 import java.text.ParseExcepti ...

  5. Java密码体系结构简介：Java Cryptography Architecture (JCA) Reference Guide

    来自Java官方的文档,作备忘使用. 简介: Java平台非常强调安全性,包括语言安全,密码学,公钥基础设施,认证,安全通信和访问控制. JCA是平台的一个主要部分,包含一个“提供者”体系结构和一组用 ...

  6. Charles配置问题

    1. 手机访问chls.pro/ssl下载证书时候,用常用安卓手机不同的浏览器(可以多试几种浏览器) 会出现两种情况,一种是直接打开下载getssl.crt文件 一种是没有反应,直接打开网页了 这时候 ...

  7. 面经 cisco 2

    1. cpu中的cache结构及cache一致性 一. 引子 在多线程环境中,经常会有一些计数操作,用来统计线上服务的一些qps.平均延时.error等.为了完成这些统计,可以实现一个多线程环境下的计 ...

  8. 算法课笔记系列（七）—— 平摊分析Amortized Analysis

    本周的内容是Amortized Analysis,是对算法复杂度的另一种分析.它的基本概念是,给定一连串操作,大部分的操作是非常廉价的,有极少的操作可能非常昂贵,因此一个标准的最坏分析可能过于消极了. ...

  9. Mybatis 级联查询时只查出了一条数据

    造成这个问题的原因是: 主表和明细表的id字段名相同造成的. 问题的关键在于resultMap中如果不定义类似主键之类的能够区分每一条结果集的字段的话,会引起后面一条数据覆盖前面一条数据的现象.

  10. 在SQL Server 2017 中，当Alwasyon group启用了DTC_SUPPORT = PER_DB, 会导致无法创建replicaiton.

    当Alwasyon group启用了DTC_SUPPORT = PER_DB, 会导致无法创建replicaiton.无法修改已经存在的replication. 原因: 当当Alwasyon grou ...