您的位置：首页 > 移动开发

移动App开发 MUI框架利用软键盘的搜索键实现页面跳转并传值

2017-12-29 22:55 776 查看

首页

html

<body>
<input type="text" name="search" id="search" value="" />
</body>

javascript

<script type="text/javascript" charset="utf-8">
mui.init();
mui.plusReady(function() {
var search = document.getElementById("search");
//				监听input框键盘事件
search.addEventListener("keypress", function(e) {
console.log(e.keyCode);
var ad = search.value;
//					当e.keyCode的值为13 即，点击前往/搜索 按键时执行以下操作
if(e.keyCode == 13) {
mui.openWindow({
url: "search.html",//跳转地址
id:"search",//id
show: {
aniShow: "slide-in-right",//页面显示动画，默认为”slide-in-right“；
duration: 300,//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒
autoShow: true //页面loaded事件发生后自动显示，默认为true
},
extras:{
text1:ad//自定义扩展参数，可以用来处理页面间传值
},
waiting: {
title: '正在玩命搜索...'//等待对话框上显示的提示内容
}
})
}
});
});
</script>

跳转页
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">
<h1 id="getText"></h1>
</div>
</body>

javascript

<script type="text/javascript">
mui.init()
mui.plusReady(function(){
//获取当前窗体对象
var page = plus.webview.currentWebview();
//接受上一页面传过来的值；
var a = page.text1;
console.log(a);
document.getElementById("getText").innerHTML = a;
})
</script>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： MUI框架移动App 搜索跳转软键盘

相关文章推荐

新的分享

章节导航

移动App开发 MUI框架 利用软键盘的搜索键实现页面跳转并传值

首页

html

javascript

移动App开发 MUI框架利用软键盘的搜索键实现页面跳转并传值