移动端坑,兼容性问题
admin
2024-05-06 07:14:28
0次

这里写目录标题

    • 获取机型 uni.getSystemInfo
    • 上下拉动滚动条时卡顿、慢 overflow-scrolling:touch;
    • 长时间按住页面出现闪退 -webkit-touch-callout:none;
    • iphone 及 ipad 下输入框默认内阴影 -webkit-appearance:none;
    • 1px 像素使用伪类元素模拟边框,使用 transform 缩放
    • click 的 300ms 延迟问题 fastclick库解决
    • ios键盘唤起,键盘收起后页面不归位 在失去焦点的时候给一个事件
    • h5底部输入框被键盘遮挡问题 document.body.scrollTop = document.body.scrollHeight
    • iOS 系统中文输入法输入英文时,字母之间可能会出现一个六分之一空格可以通过正则去掉

获取机型 uni.getSystemInfo

原生 :navigator.userAgent
uniapp;	uni.getSystemInfo({success(res) {console.log(res.brand) //手机牌子console.log(res.model) //手机型号console.log(res.screenWidth) //屏幕宽度console.log(res.screenHeight) //屏幕高度}}); 

上下拉动滚动条时卡顿、慢 overflow-scrolling:touch;

长时间按住页面出现闪退 -webkit-touch-callout:none;

iphone 及 ipad 下输入框默认内阴影 -webkit-appearance:none;

1px 像素使用伪类元素模拟边框,使用 transform 缩放

click 的 300ms 延迟问题 fastclick库解决

在document.body 上绑定 touchstart 和 touchend
其中,touchstart 用于记录当前点击元素的targetElement。
touchend 阻止默认事件,通过DOM自定义事件模拟一个click事件

ios键盘唤起,键盘收起后页面不归位 在失去焦点的时候给一个事件

h5底部输入框被键盘遮挡问题 document.body.scrollTop = document.body.scrollHeight

const ua = navigator.userAgent;
const iOS = /iPad|iPhone|iPod/.test(ua);
const input = document.querySelector('#input');input.addEventListener('focus', () => {setTimeout(() => {if (iOS) {if (!/OS 11_[0-3]\D/.test(ua)) {document.body.scrollTop = document.body.scrollHeight;   }} else {input.scrollIntoView(false);}}, 300);
});

iOS 系统中文输入法输入英文时,字母之间可能会出现一个六分之一空格可以通过正则去掉

this.value = this.value.replace(/\u2006/g, '');

相关内容

热门资讯

两只大牛股,紧急发声:不属实!... 5天3板超声电子:“超声电子高频板通过英伟达认证”情况不属实,目前无产品供货给英伟达9月13日晚间,...
科创板创新药企BD授权交易总额... 2026年半年度财报季已收官,在创新药企业以业绩扭亏和BD兑现吸引市场目光的同时,以CXO为代表的上...
蔚来李斌1-8月交付增近58%... 9月9日消息,上海蔚来汽车有限公司副总裁品牌与传播资深专家马麟在微博透露,9月8日下午,蔚来创始人、...
京东物流部署过万前置仓应对手机... IT之家 9 月 13 日消息,据京东物流黑板报,9 月,多个品牌旗舰手机集中上新。针对消费者希望尽...
特朗普让泽连斯基勿袭击俄柴油燃... 9月13日,当地时间9月13日,美国总统特朗普要求乌克兰总统泽连斯基停止袭击俄罗斯柴油燃料设施,称相...
下周,年内最便宜新股启动打新 ... 2026.09.13本文字数:1467,阅读时长大约2分钟作者 |第一财经 安卓封图 |AI生成下周...
北京:激活地理信息要素赋能城市... 9月13日,从北京市规划和自然资源委员会获悉,《北京市测绘地理信息条例》已由北京市第十六届人民代表大...
接下来该如何逃顶?建议看看这篇... 最近这段时间,很多朋友的心里其实都是悬着的。行情走到这个位置,大家见面聊得最多的就是,接下来到底该怎...
武汉:到2035年武汉区域科技... 9月13日,武汉市委十四届十三次全会召开,审议通过了《关于打造具有全球竞争力的开放创新生态 高水平建...
卡塔尔股市收盘上涨0.25% 9月13日,卡塔尔证券交易所主要股指今日收盘上涨0.25%,报9848.95点,上涨24.46点。全...