• ios上遇到的坑(持续更新)


    1.input不能与position:fixed;的元素不能共存,在页面滚动且input是focus状态时,fixed的元素会跟着页面同时滚动;

    2.ios中的input不能设置user-select:none;否则会input变成不可输入状态;

    3.ios中的li,div,span等等元素(具体没有试验,貌似除了a标签以外),绑定的click点击事件是无效,当CSS中加了cursor:pointer;后,所绑定的事件才有效;同时出现了点击后又背景色高亮的效果;(处理方法有使用手机touchend等事件,或者用zepto.js里面绑定的tap事件)

    4.body {-webkit-overflow-scrolling: touch;overflow-scrolling: touch;}  /*解决上下拉动滚动条时卡顿、慢*/ios中是个bug,当body实际高度不足时,会遮盖底部fixed的元素*/

    5. $('document').on("touchend","div",function(){}) ios上,点击有效,但如果是弹窗的话,会点击穿透后面的元素(a标签即跳转);

        $('document').on("click","div",function(){}) ios上,点击无效;

        $('div').on("click", function(){}) ios上,点击有效,且不会穿透;(暂未研究是不是其他js,fastclick.js的影响)
    6. 跑马灯标签(marquee标签在iphone手机上样式会渣掉)

    <marquee>
        <a>文字内容</a>
        <a>文字内容</a>
        <a>文字内容</a>
    </marquee>

    无任何样式时,安卓手机上是正常的,在苹果手机上会渣掉;

    解决方法(参考chrone中:host中定义的样式):

    marquee {
        display: inline-block;
        overflow: hidden;
        text-align: initial;
        white-space: nowrap;
    }

    7.postion:fixed定义的底部按钮,会出现在个别iphone中渲染时,消失不见的情况:

    猜测原因,body中内容的高度不足一屏的原因,解决方法:

    html{ height: 100%;}
    body{ min-height:100%}

     8.iphone手机的input是readonly时,还是光标还是会进入。改为disabled后会出现颜色有透明度的情况

    input:disabled{
      -webkit-text-fill-color: rgba(255, 255, 255, 1);
      -webkit-opacity: 1;
    }

    参考页面

     9.iphone6plus对flex的布局部分属性必须使用-webkit-前缀,不然样式会渣掉,目前有:

    {
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    }

     10. tp中foreach 与 volist便签的区别:

    参考页面

    <后续补充应对的详细方法>

  • 相关阅读:
    iOS开发之Masonry框架源码解析
    iOS开发针对对Masonry下的FPS优化讨论
    React-native Android环境搭建
    Android中ListView使用总结
    Android开发布局方式
    轮播图
    大文件断点下载
    基于第三方库FMDB的数据库的二次封装
    md5加密
    AssignToObject文件(字典转模型、字典数组转模型数组)
  • 原文地址:https://www.cnblogs.com/zhu-shixin/p/6492190.html
Copyright © 2020-2023  润新知