使用iscroll4 解决了可编辑元素的focus问题,也解决了滚动条刷新需要加一定的延时等待html数据加载完成问题,但是遇到了一个由于移动端的软件盘弹出后影响了页面布局,导致滚动内容溢出到可见窗体之外,尤其是在聚焦状态下滚动时极易发生该种情况
目前遇到问题的wrapper使用的绝对定位
加入一个监控窗口大小变化时的监听,参考自针对移动端键盘弹起页面布局样式改变问题
var winHeight = $(window).height(); //获取当前页面高度
$(window).resize(function(){
console.log("窗口大小变化")
//当窗体大小变化时
var thisHeight = $(this).height(); //窗体变化后的高度
if (winHeight - thisHeight > 50) {
console.log("-1--");
//变化时改为相对定位
$("#wrapper").css("position","relative");
} else {
console.log("-2--");
//恢复后改为绝对定位
$("#wrapper").css("position","absolute");
myscroll.refresh();
}
})
但是当前的话只是解决了一半,仍然会出现滚动消失问题,为了避免聚焦状态下滚动发生问题,在touchmove即滚动条滚动时
onScrollMove: function () { //拉动时
//上拉加载
document.activeElement.blur();
//。。。。其他代码省略
}
即修改后,在滚动时去掉已聚焦元素的聚焦状态;当然这样仍然有情况是按住文本域滚动时不会触发onScrollMove,但是在聚焦状态接触后会恢复正常
当然这不是一个好的解决办法,如果各位xd有好的办法的话,还请教教我这个小白,万分感谢。