mui 窗口管理及窗口之间的数据传递
<!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 窗口管理及窗口之间的数据传递的更多相关文章
- (转载)Javascript操作表单之间的数据传递
(转载)http://www.aspxhome.com/javascript/skills/200710/214825.htm 今天有朋友问我关于用JAVASCRIPT来进行页面各表单之间的数据传递的 ...
- HTML5中window.postMessage,在两个页面之间的数据传递
HTML5中window.postMessage,在两个页面之间的数据传递 2015年11月3日 8536次浏览 关于postMessage window.postMessage虽然说是html5的功 ...
- Vue 爬坑之路(二)—— 组件之间的数据传递
Vue 的组件作用域都是孤立的,不允许在子组件的模板内直接引用父组件的数据.必须使用特定的方法才能实现组件之间的数据传递. 首先用 vue-cli 创建一个项目,其中 App.vue 是父组件,com ...
- 解决vue不相关组件之间的数据传递----vuex的学习笔记,解决报错this.$store.commit is not a function
Vue的项目中,如果项目简单, 父子组件之间的数据传递可以使用 props 或者 $emit 等方式 进行传递 但是如果是大中型项目中,很多时候都需要在不相关的平行组件之间传递数据,并且很多数据需要 ...
- JSP、servlet、SQL三者之间的数据传递
JSP.servlet.SQL三者之间的数据传递 博客分类: web开发 JSPservletSQL数据库连接池web开发 前言: 最近一直在做WEB开发,现总结一下这一段时间的体会和感触. 切记, ...
- (转)Vue 爬坑之路(二)—— 组件之间的数据传递
Vue 的组件作用域都是孤立的,不允许在子组件的模板内直接引用父组件的数据.必须使用特定的方法才能实现组件之间的数据传递. 首先用 vue-cli 创建一个项目,其中 App.vue 是父组件,com ...
- ASP.NET MVC3中Controller与View之间的数据传递
在ASP.NET MVC中,经常会在Controller与View之间传递数据,因此,熟练.灵活的掌握这两层之间的数据传递方法就非常重要.本文从两个方面进行探讨: 一. Controller向Vie ...
- Activity之间的数据传递
最常用的Activity之间的数据传递. btnStartAty1.setOnClickListener(new View.OnClickListener() { @Override public v ...
- ASP.NET MVC 之控制器与视图之间的数据传递
今天,我们来谈谈控制器与视图之间的数据传递. 数据传递,指的是视图与控制器之间的交互,包括两个方向上的数据交互,一个是把控制器的数据传到视图中,在视图中如何显示数据,一个是把视图数据传递到控制器中, ...
- iOS开发中视图控制器ViewControllers之间的数据传递
iOS开发中视图控制器ViewControllers之间的数据传递 这里我们用一个demo来说明ios是如何在视图控制器之间传递重要的参数的.本文先从手写UI来讨论,在下一篇文章中讨论在storybo ...
随机推荐
- Avizo/Amira应用 - 如何计算面孔率
对于在Avizo或Amira中如何计算孔隙率,这个太简单,完成孔隙和整体材料的识别,再利用Volume Fraction计算即可获得,这里说的是每一层的面孔率如何计算? 数据导入,选取一个简单的过滤处 ...
- Eclipse创建第一个Spring Boot项目
一.安装SpringBoot插件 安装过程需要联网下载插件,属于在线安装,请耐心等待安装完成,下载安装完成以后,需要重启Eclipse 二.创建Spring Boot项目 如下图所示new-other ...
- lua 源码分析之线程对象lua_State
lua_State 中放的是 lua 虚拟机中的环境表.注册表.运行堆栈.虚拟机的上下文等数据. 从一个主线程(特指 lua 虚拟机中的线程,即 coroutine)中创建出来的新的 lua_Stat ...
- mac 10.12 sierra 机械键盘+ratm可编程鼠标记录
系统:mac 10.12 sierra 键盘:机械键盘 鼠标:mad catz ratm 在mac 10.11/10.12 之前: 机械键盘:一般的机械键盘在mac上使用, alt 和 win 键 ...
- 【Java】Java8的Lambda入门记录
简化定义匿名实现类 匿名实现类的传统方式 创建一个线程,需要实现Runnable接口,并实现public void run()方法,用传统的方式是这样的: public static void mai ...
- redis跳跃表
最近在阅读redis设计与实现,关于redis数据结构zset的一种底层实现跳跃表一直没有太理解,所以在搜了一下资料,终于搞懂了它的设计思路,记录一下. 参考链接:https://mp.weixin. ...
- 【iCore4 双核心板_uC/OS-II】例程十一:内存管理
一.实验说明: 应用程序在运行中为了某种特殊需要,经常需要临时获得一些内存空间.而作为比较完善的操作系统uC/OS-II,也具有动态分配内存的能力. uC/OS-II对内存进行两级管理:把连续内存分成 ...
- java.util.function 中的 Function、Predicate、Consumer
函数式接口: 函数式接口(Functional Interface)就是一个有且仅有一个抽象方法,但可以有多个非抽象方法的接口. 函数式接口可以被隐式转换为 Lambda 表达式. Function ...
- R语言扩展包dplyr——数据清洗和整理
R语言扩展包dplyr——数据清洗和整理 标签: 数据R语言数据清洗数据整理 2015-01-22 18:04 7357人阅读 评论(0) 收藏 举报 分类: R Programming(11) ...
- phalcon bug: model的findFirst会自动忽略一些空格
version: Phalcon 3 如果DB存在一条记录phone='13012345678 '(后边有一个空格), 则在查询User::findFirst("phone = '13012 ...