转自 https://blog.csdn.net/elementFei/article/details/72917393 感谢

问题: 使用mui框架开发App,当input获取焦点时,键盘弹出,底部导航栏上升。
解决:

//获取当前页面(在子页面上书写)
var ws;
if(window.plus) {
plusReady();
}else {
document.addEventListener(“plusready”, function() {
plusReady();
}, false);
}
function plusReady() {
ws = plus.webview.currentWebview();
}
//获取当前页面的input
var search = document.querySelector(‘#input’);
search.onfocus = function(){
//设置父页面的导航栏隐藏
ws.parent().evalJS(“document.getElementById(‘nav’).style.display=’none’”);
//当前子Webview窗口的样式()
ws.setStyle({bottom: ‘0px’});
}
search.onblur = function(){
//设置父页面的导航栏显示
ws.parent().evalJS(“document.getElementById(‘nav’).style.display=’block’”);
//当前子Webview窗口的样式(和子页面在父页面上的bottom保持一致)
ws.setStyle({bottom: ‘50px’});
}`
————————————————
版权声明:本文为CSDN博主「elementFei」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/elementFei/article/details/72917393

使用mui框架开发App,当input获取焦点时,键盘弹出,底部导航栏上升。的更多相关文章

  1. input获取焦点软键盘弹出影响定位

    解决移动端底部fixed和input获取焦点软键盘弹出影响定位的问题$(document).ready(function() {                                var ...

  2. 移动端解决fixed和input获取焦点软键盘弹出影响定位的问题

    场景描述, 当document的高度不够window的高度时候,如在ip6中文档的高度比窗体的高度小,到底设计在最下方的区域没有在窗体最下方,就留有空白地方如下图的灰色部分 1. 解决初始化文档高度, ...

  3. 小程序中点击input控件键盘弹出时placeholder文字上移

    最近做的一个小程序项目中,出现了点击input控件键盘弹出时placeholder文字上移,刚开始以为是软键盘弹出布局上移问题是传说中典型的fixed 软键盘顶起问题,因此采纳了网上搜到的" ...

  4. 移动端解决input focus后键盘弹出,高度被挤压的问题

    //解决弹出键盘页面高度变化bug var viewHeight = window.innerHeight; //获取可视区域高度 $("input").focus(functio ...

  5. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 字体图标(Glyphicons):带有字体图标的导航栏

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. iOS开发实用技巧—在手机浏览器头部弹出app应用下载提示

    iOS开发实用技巧—在手机浏览器头部弹出app应用下载提示 本文介绍其简单使用: 第一步:在本地建立一个访问的服务端.  打开本地终端,在本地新建一个文件夹,在该文件夹中存放测试的html页面.   ...

  7. 解决input获取焦点时底部菜单被顶上来问题

    <div class="search-box"> <input class="search-input" type="text&qu ...

  8. web移动端Fixed在Input获取焦点时ios下产生的BUG及处理

    1.现象 可以看到下面两张图,图1搜索框为fixed固定在顶部,滚动没有任何问题. 图2当光标进入搜索框时,ios自作聪明的把光标定位到中间,并且fixed属性被自动修改成了absolute.此时注意 ...

  9. mui底部导航栏切换分页

    使用Hbuilder的mui框架开发移动端非常便利.高效: 底部导航栏切换功能也是移动APP开发中必须实现的: 引入mui文件.下面会用到jquery,同时引进 <link href=" ...

随机推荐

  1. CCCC 正整数A+B

    题意: 本题的目标很简单,就是求两个正整数A和B的和,其中A和B都在区间[1,1000].稍微有点麻烦的是,输入并不保证是两个正整数. 输入格式: 输入在一行给出A和B,其间以空格分开.问题是A和B不 ...

  2. Python调用OpenCV读显写

    OpenCV提供了python的接口,而且很重要的一点是python下的很多接口名与C++的接口名是一样的,这一篇先记录python调用OpenCV去读取图像.显示图像和保存图像. 1.OpenCV读 ...

  3. Java哪些集合类是线程安全的?

    早在jdk的1.1版本中,所有的集合都是线程安全的.但是在1.2以及之后的版本中就出现了一些线程不安全的集合,为什么版本升级会出现一些线程不安全的集合呢?因为线程不安全的集合普遍比线程安全的集合效率高 ...

  4. Anaconda: "WinError 127 找不到指定程序"

    Ref: https://blog.csdn.net/mengmengz07/article/details/103629693 问题: Windows系统,使用Anaconda,conda crea ...

  5. Java时间格式化年-月-日-时间

    Date d = new Date(); System.out.println(d); //Sat Mar 16 20:58:56 CST 2019 System.out.println(d.toLo ...

  6. CSU 1425 NUDT校赛 I题 Prime Summation

    这个题本来有希望在比赛里面出了的 当时也想着用递推 因为后面的数明显是由前面的推过来的 但是在计算的时候 因为判重的问题 ...很无语.我打算用一个tot[i]来存i的总种树,tot[i]+=tot[ ...

  7. MySQL学习笔记——〇六SQLAlchemy框架

    我们在前面所用的方法都是在可视化的视图软件或者terminal里直接写SQL语句来对数据库进行访问,这里我们大概讲一下一个新的框架——SQLAlchemy. OEM框架 OEM的概念 对象-关系映射( ...

  8. ICRA 2019最佳论文公布 李飞飞组的研究《Making Sense of Vision and Touch: Self-Supervised Learning of Multimodal Representations for Contact-Rich Tasks》获得了最佳论文

    机器人领域顶级会议 ICRA 2019 正在加拿大蒙特利尔举行(当地时间 5 月 20 日-24 日),刚刚大会公布了最佳论文奖项,来自斯坦福大学李飞飞组的研究<Making Sense of ...

  9. java 面向对象概述, 函数解析

    函数:class FunctionDemo { public static void main(String[] args) { /* int x = 4; System.out.println(x* ...

  10. 吴裕雄--天生自然 PYTHON3开发学习:数字(Number)

    print ("abs(-40) : ", abs(-40)) print ("abs(100.10) : ", abs(100.10)) #!/usr/bin ...