layim在ios上的一些问题

layim1.0.9中在ios上上下滑会出现卡顿的情况;在消息列表和好友列表及消息详情都会有

原因是layui.js里面关于设备判断的方法,先判断为“mac”,在判断“ios”;

代码如下:

os: function(){ //底层操作系统
if(/windows/.test(agent)){
return 'windows';
} else if(/linux/.test(agent)){
return 'linux';
} else if(/mac/.test(agent)){
return 'mac';
} else if(/iphone|ipod|ipad|ios/.test(agent)){
return 'ios';
}
}();
页面都是用fixed的会导致吸顶,所以卡住;
新版的layui.js已经改变了这个顺序,
os: function(){ //底层操作系统
if(/windows/.test(agent)){
return 'windows';
} else if(/linux/.test(agent)){
return 'linux';
}else if(/iphone|ipod|ipad|ios/.test(agent)){
    return 'ios';
}
else if(/mac/.test(agent)){
return 'mac';
}
}();

并且在moblie.js里面有专门监听ios的touch事件,
s.ios && i.on("touchmove", function (e) {
var a = i.scrollTop();
a <= 0 && (i.scrollTop(1), e.preventDefault(e)), this.scrollHeight - a - i.height() <= 0 && (i.scrollTop(i.scrollTop() - 1), e.preventDefault(e))
})

这样可以解决卡顿的问题,但是这种情况就有有一种在顶部或者底部滑第一下的时候,先是滚动1,不吸顶,需要滑两次才滚动,会让用户有用自己没滑到的错觉;

研究之后的解决办法
可以换成新版本,如果不换,就自己写一个判断设备的方法然后监听事件;
优化滑两次的方法,判断用户手指滑动方向,在document.addEventListener("touchend",function (e) {})方法里手动让页面滚动,不过不太流畅;
另外,ios中输入框获取焦点时,键盘会弹起遮盖住输入框解决办法:
判断设备为ios监听事件即可,不过如果用户切换输入法还是会被挡住,需要用户自己滑出来
$(document).on("focus",".layim-chat-send input" ,function() {
setTimeout(function(){
document.body.scrollTop = document.body.scrollHeight;
},300);
});
posted @ 2018-11-30 13:38  small_lady  阅读(713)  评论(0编辑  收藏  举报