不定时更新 ------- 移动端兼容性问题

也不知道从哪里开始,就每次遇到或者想起来,就写一点吧

1.0 iPhone 下,input 设置属性 readonly 后,光标不消失问题 和 键盘不消失

解决方式
1. 设置 disabled 属性,不过有弊端: 元素的所有事件都消失了
2. 设置聚焦时候瞬间失去焦点
javascript $('input[readonly]').on('focus', function() { $(this).trigger('blur'); });
3. 使用兼容 css 设置(推荐
css -webkit-user-select:none -webkit-touch-callout:none;
4. 使用 js 控制
html <input onfocus="this.blur()">

2.0 iPhone 下 new Date(str) 获取时间为 null 问题

> 今天 使用 angular 写了一个 时间的管道。上到测试服务器一看 ,瞬间爆炸 全部 NaN ,当时就不乐意了 经过调试 发现是 `new Date(strTime)` 没有获取到时间,获取的是空值。真是恶心的浏览器兼容问题。
*问题原因*
    - JS中要求Date类型转换的原始数据格式是yyyy/mm/dd之类的
    - 而我的 `strTime` 是以 `-` 分割的 Android 下没有问题。苹果下有时候就会出现获取失败的问题
*解决方法*
    使用字符串替换
        ```javascript
            strTime = strTime.replace(/-/g,"/");
        ```

3.0 iPhone 下,去掉默认 x

*解决方法*
```css
    input::-webkit-search-cancel-button {
        display: none;
    }
```

posted on 2017-06-29 19:04  杨文鹏  阅读(140)  评论(0)    收藏  举报

导航