转自 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. SAP_SD常用事务代码

    1.创建/修改/显示销售订单:VA01/VA02/VA03 2.根据销售订单创建交货单:VL01N 3.修改/显示交货单:VL02N/VL03N 4.交货单发货过账:VL02N 5.发货过账冲销:VL ...

  2. 关于Vue element-ui中诡异问题的解决思路

    最近在做Element-ui项目时总是会出现些异步及其一些诡异问题,关于vue 的异步原理就不多说了,感觉大部分的问题都可以用Vue.nextTick来解决,Vue.nextTick是等DOM二次加载 ...

  3. BZOJ 4084 [Sdoi2015]双旋转字符串

    题解:hash 至今不会unsigned long long 的输出 把B扔进map 找A[mid+1][lenA]在A[1][mid]中的位置 把A[1][mid]贴两遍(套路) 枚举A[mid+1 ...

  4. getComputedStyle() 和 getPropertyValue()

    // getComputedStyle() 方法用于获取指定元素的 CSS 样式. // 获取的样式是元素在浏览器中最终渲染效果的样式. // getPropertyValue() 方法返回指定的 C ...

  5. .NET微信开发 配置微信公众号基本配置的几种方法

    自己最近搞了公众号,记录一下. 目的就是为了在微信公众号里启用服务器配置. 微信文档 其实微信文档已经写得很清楚了,也很简单.(微信的目的就是它发送一个get请求,希望我们能接受一下,然后给微信回个数 ...

  6. Linux设置邮箱发送邮件

    安装sendmail服务 然后配置/etc/mail.rc文件,如果没有生成就自己建立. 内容如下: set from=xxx@163.com smtp=smtp.163.com set smtp-a ...

  7. Iptables的规则语法

    Iptables的规则语法 分类: 防火墙2012-04-19 17:09 1228人阅读 评论(0) 收藏 举报 inputtcpfilter防火墙output网络 (一) 基本语法 iptable ...

  8. iOS 内购相关

    iOS 内购相关 下面总结一下过往订阅和内购的项目的代码方面的实现细节和注意事项,特别是掉单方面的处理. 后台的协议.商品ID.银行卡.内购类型.沙盒账号测试人员都由运营或者产品在苹果后台中申请处理. ...

  9. Ubuntu16.04编译tensorflow的C++接口

    原文:https://www.bearoom.xyz/2018/09/27/ubuntu1604buildtf4cpp/ 之前有一篇介绍到在windows下利用VS2015编译tensorflow的C ...

  10. linux文件软链接与硬链接

    1.命令格式: ln [参数][源文件或目录][目标文件或目录] 软链接只会在你选定的位置上生成一个文件的镜像,不会占用磁盘空间. 2.命令功能: Linux文件系统中,有所谓的链接(link),我们 ...