界面中就一个webview，顶部为一个header，header上有一个搜索框，中间区域为一个列表，用来展示搜索结果，在不弹出软键盘的情况下，不管list中结果再多，上下滑动滚动list内容时header都会固定在顶部，但是点击搜索框弹出软键盘后，再滚动list中的结果时header就会随着页面的向上滚动而从顶部消失。安卓下没问题，就ios有问题，求助，何解？
叶孤村
- 发布：2015-09-16 16:04
- 更新：2019-08-27 15:33
- 阅读：25754
最佳回复
这个问题是已经可以解决了的，不信可以去看mui demo里面的那个聊天程序 im-chat.html
首先说一下为什么会出现这个情况，那是因为ios弹出软键盘的时候，webview的高度没有变化导致超出屏幕范围，而plus这时候又会自动把header的 position：fixed 属性设置为 position：relative，header就跟着滚动了。。。。
解决办法很简单，只要是现在最新版本的plus，都有这个
plus.webview.currentWebview().setStyle({
softinputMode: "adjustResize" // 弹出软键盘时自动改变webview的高度
});只要你在plusready里面写入这个，就可以解决header跟着滚动的问题
==============问题结束分割线===============
虽然楼主可能没遇到，不过也再顺便补充一个：如果页面中包含header、mui-content、footer，当mui-content内容很多，已经可以滚动，这时候弹出键盘，又会出现header可以滚动的情况
这时候已经不是plus的问题了，而是css的问题（ios的坑），而是webview已经改变高度了，但是html、body的高度没有改变。
解决办法就是写一段css样式：
html, body {
height: 100%;
margin: 0px;
padding: 0px;
overflow: hidden;
-webkit-touch-callout: none;
-webkit-user-select: none;
}只要写了这段样式，页面就会随着webview的改变而改变
其实plus、mui框架很好用，只是plus有坑，ios有坑，安卓也有坑，花点时间把坑都踩一遍就没什么问题啦~~
叶孤村 (作者)
问题搞定了，感谢@豆腐果lyl ，但必须加上一点，就是要在mui-content上添加样式overflow: auto; 因此总结说来就是：
1 设置弹出软键盘时自动改变webview的高度
plus.webview.currentWebview().setStyle({
softinputMode: "adjustResize" // 弹出软键盘时自动改变webview的高度
});2 增加样式
html, body {
height: 100%;
margin: 0px;
padding: 0px;
overflow: hidden;
-webkit-touch-callout: none;
-webkit-user-select: none;
}
.mui-content {
height: 100%;
overflow: auto;
}content上必须要有height和overflow样式的控制，否则body上设置的overflow: hidden;会使所有content都无法滚动。
目前看来同一个页面中只要是有需要弹软键盘做输入的输入框和header，在ios下就都会有这个问题，我们程序中好多界面都统一做了上面那样的调整，像这种比较通用的问题，官方可否考虑在框架上统一做一下支持？否则很多类似需求（太普遍了）都会踩到这个坑。
我也遇到了这样的问题，通过你们的方法问题解决了，不过又遇到了别的问题，
我的是个单页面，上面是header，下面是一个随着屏幕滚动（fiexd）的输入框，我要实现的是滚动一定的距离显示返回顶部按钮。
遇到的问题是：
1.监听类名是mui-content的div的scroll事件，在这个事件中获取滚动的距离，试了很多方式都获取不到，最后通过浏览器debug找到了一个方法，e.currentTarget.scrollTop，这个方法可以获取到滚动的距离。（最终用的是document.body.scrollTop || e.detail.y;）
- 接下来就是出现了这个问题，点击返回顶部没反应，我是用mui('body>.mui-content').pullRefresh().scrollTo(0, 0, 100);这种方式返回的顶部，最后通过给mui-content这个div设置一个id，在初始化上拉加载，数据加载完之后直接将上拉加载禁止掉。
虽然上面的问题是解决了，不过又出现了第三个问题了
3.点击页面下方的输入框，会弹出输入法，将输入法缩回去，整个页面都成白的了，只有头部和最下面的输入框。
最终我是这样做的
页面添加样式
html, body {
height: 100%;
}
.mui-content {
height: 100%;
}初始化上拉加载
mui.init({
pullRefresh :{
container:"#pullrefresh",
up : {
contentrefresh : "",//可选，正在加载状态时，上拉加载控件上显示的标题内容
contentnomore:'',//可选，请求完毕若没有更多数据时显示的提醒内容；
callback :upLoadList //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
}
}
});
function upLoadList(){}plusReady之后添加
plus.webview.currentWebview().setStyle({
softinputMode: "adjustResize" // 弹出软键盘时自动改变webview的高度
});
//添加这个是因为在安卓上设置自动调整页面高度，滑动的时候会有卡顿的效果
if(!lm.app.isIOS()){
$("html").css("height","auto");
$("body").css("height","auto");
}加载完数据禁止掉上拉加载
mui('#pullrefresh').pullRefresh().disablePullupToRefresh();
这是我遇到的问题，有点啰嗦了，希望能帮到大家！
叶孤村 (作者)
官方Demo上就存在的问题，难道说这根本就不算是问题？现在有几个页面都有这个情况，真不想把header和content拆成不同的webview，每多拆个webview出来都会带来更多的内存占用。。
叶孤村 (作者)
@豆腐果lyl 您好，感谢回复！试了您提供的方案，还是不行。。
- 设置softinputMode: "adjustResize"在list中项很少的时候还有用处，但list中内容稍微多点，比如满屏，再设置这个就无效了。
- 加上html, body对应的那段样式之后，list中的内容直接都不能滚动了。当然，把overflow: hidden;去了后就能滚动，但去了之后这段样式类加不加都没区别了，header还是一样跟着从顶部滚动消失。。
我来回复一下，谢谢题主给出的解决方案，同时之前我也从另外一个类似问题的回复中得到一些线索，但就是不懂得用，看到题主的解决方案，我终于把那个线索给试出来了
线索地址：http://ask.dcloud.net.cn/question/6833 ，里面的第八楼，回复1中有人给出答案了
首先题主给的那些代码和CSS用上去了，不会导致页面错位，但有一个也很要命的问题就是，软键盘弹出来以后，会把底下的输入框给覆盖掉，必须手动划到底下才能看到文本框，我现在给出我的解决方案
这个方案只需要CSS，不但完美解决错位问题，还可以解决软键盘弹上去后的文本框定位问题
html,
body {
height: 100%;
margin: 1px 0 0 0;
}
有他一个问题问大神们，我设置html和body的样式为overflow:hidden,再设置内容区overflow:auto，我的内容区有一个可滚动的div，我发现软键盘弹起再落下后我的div就不可滚动了，这是为什么？
蔡邵鑫
添加了body 的 height 就没法滚动了
不添加就是有软键盘的时候输入框飞走了
有没有兼容的
2017-11-29 16:44
罗罗诺亚索隆
没用
2017-12-18 16:59
JSail
没有效果
2018-03-26 23:19
兮颜A
有人弄好了吗
2018-04-19 17:02
c***@163.com
设置了 第一段代码出现一个问题就是底部的输入框会跟着弹上去
2018-06-23 21:55
兮颜A
这个样式和刷新会冲突，有刷新这个样式就没用了。有人解决了吗？
2018-07-03 10:17