小程序开发安卓/ios兼容踩坑合集

news/2024/7/8 0:07:22

时间格式时IOS不兼容的问题

原因:iOS系统不能识别XXXX-XX-XX(2020-05-20 12:00:00)格式的,需要将格式转换成 2020/05/20
12:00:00

解决:

var date1 ="2020-05-20 12:00:00"
date1 = date1.replace(/-/g, '/');
console.log(date1) //2020/05/20 12:00:00

margin在IOS真机中失效

情境:在页面中元素使用margin值,在某些IOS设备下会出现失效的情况,而安卓机则正常显示。

解决:此问题暂无直接的解决方案,当前使用空DIV控制间距。
本人实际项目中因为涉及到的是样式问题因此最终以判断真机是否为iOS平台而动态加载样式解决,有更好的解决方案或者知道问题所在的朋友欢迎评论区留言指教

input 选择文字更多文字向下滑动,键盘消失问题

情境:input框中选择文字更多的时候向下滑动键盘会消失。

解决:always-embed=“{{true}}”

<input type="text" placeholder="请输入搜索内容" confirm-type="search" placeholder-class="placeholder" value="{{inputValue}}" always-embed="{{true}}" />

input的placeholder属性字体不居中/输入内容不居中

解决:
1、设置line-height及font-size
2、对input设置高度

页面滚动卡顿

解决:设置-webkit-overflow-scrolling:touch;

隐藏scroll-view滚动条

解决:样式中设置

::-webkit-scrollbar{
	width: 0;
	height: 0;
	color: transparent;
}

视频播放格式问题

<video src="{{videoSrc}}" controls   custom-cache="{{cache}}"></video>
cache:false

ios 表单元素 input 和textarea 默认有内阴影

解决:

 input{  -webkit-appearance: none; } 

ios键盘弹出导致页面显示异常

原因: ios上的软键盘会使页面的fixed定位失效。

解决办法: 可以监听resize事件(浏览器窗口大小调整时触发),当键盘弹出的时候,更改页面的position属性值。

安卓ios打开相机选择相册

解决:

<input class="js_upFile cover1" type="file" name="cover" accept="image/*" capture="camera" multiple/>
$(function () {
    //获取浏览器的userAgent,并转化为小写
    var ua = navigator.userAgent.toLowerCase();
    //判断是否是苹果手机,是则是true
    var isIos = (ua.indexOf('iphone') != -1) || (ua.indexOf('ipad') != -1);
    if (isIos) {
        $("input:file").removeAttr("capture");
    };
})

ios底部安全区适配

解决:

padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);

记录贴,更多踩坑待补充。。。


http://lihuaxi.xjx100.cn/news/559498.html

相关文章

Git:在实际开发中的使用(够你用十年)

Repository 我们先来认识一下版本库——Repository&#xff0c;接下来我们所有提到的 Git 基础命令&#xff0c;都是基于版本库的。 那么什么是版本库呢&#xff1f;版本库又名仓库&#xff0c;英文名 repository&#xff0c;你可以简单理解成一个目录&#xff0c;这个目录里面…

ZYNQ printk 缓冲区读取

之前调试kenel &#xff0c;如果kenenl崩溃会&#xff0c;通过内核system.map定位log_buf变量地址&#xff0c;给cpu复位&#xff0c;在u-boot中读取对应的物理地址&#xff0c;即可知道最终内核崩溃最后打出的消息。 我在使用 5.4.154这个内核版本&#xff0c;中没有log_buf这…

4. 识别线程

识别线程线程表示类型为std::id可以通过两种方式进行检索第一种可以通过std::thread 的对象成员函数get_id()来直接获取 第二种是在当前线程中调用std::get_id()void func(){cout<<"print id in son process"<<std::this_thread::get_id()<<endl; …

tomcat组件-Server

目录 概述 tomcat 启动 大致流程 Server StandardServer 利用8005端口关闭tomcat 总结 概述 了解一个程序&#xff0c;一定要知道他是干什么的&#xff0c;以及内部架构如何支撑这么干的&#xff0c;以及牵扯的到的概念、模式等知识点的解析(这里只介绍组件)。 Tomcat是…

<C++>二叉树进阶

文章目录为什么要学这一节1. 二叉搜索树1.1 二叉搜索树概念1.2 二叉搜索树操作1.3 二叉搜索树的实现1.4 二叉搜索树的应用1.5 二叉搜索树的性能分析2. 经典题目2.1 最近公共祖先2.2 从前序与中序遍历序列构造二叉树2.3 二叉树的前序遍历&#xff08;非递归&#xff09;为什么要…

vue新春游戏-拼手速抢车票小游戏,学习玩乐两不误,春节小游戏,新年小游戏

ue新春游戏-拼手速抢车票&#xff0c;老规矩&#xff0c;体验地址&#xff1a;http://game.pkec.net/word-ticket/。 写这个主要是前几天群里运营老师说咋没人写抢车票的&#xff0c;再加上我上一篇文章上了掘金一周&#xff0c;听说多上几次有证书&#xff0c;我还没搞到过掘金…

JVM垃圾回收相关算法-垃圾清除阶段

文章目录学习资料垃圾回收相关算法垃圾清除阶段标记-清除&#xff08;Mark - Sweep&#xff09;算法复制算法标记-压缩&#xff08;或标记-整理、Mark - Compact&#xff09;算法分代收集算法增量收集算法分区算法学习资料 【尚硅谷宋红康JVM全套教程&#xff08;详解java虚拟…

FORM中的日历开发

Calendar是Template提供给我们的standard object.可以使我们方便的为日期型字段提供日期的选择列表. 为项指定值列表 KEY-LISTVAL触发器 calendar.show; calendar.show(SYSDATE);--显示当前时间 相关函数 calendar.show(first_date date default null) calendar.setup(new…