IOS系统踩坑2

路漫漫其修远兮，吾将上下而求索。
不禁感叹移动端的h5兼容真心是一门艺术~~

1. ios中设置input 的type = number 限制只能输入数字无效，安卓有效

解决方法：

2. ios 中select标签设置text-align:right；text-align-last:right无效,安卓有效

解决方法：

 
     12个月
     24个月
     36个月
   

实现效果：

效果图

不过，当选项过多产生滚动条的时候，该方法并不友好，会有滚动条位置遮盖选项的问题：

效果图

最终解决方法：

  

            {{formData.deadline || '请选择'}}
            
              12个月
              24个月
              36个月
            
 

实现原理：
用span元素展示选中结果，将select设置成透明并覆盖在span冤死上面
默认展示‘请选择’的hint，字体颜色为较浅，监听select的change事件，修改展示的字体颜色

默认效果

选中后

3.在ios客户端打开的h5页面如果没有encode，那么如果链接中存在中文或者‘@、+’等特殊符号会遇到如下问题：

修改新的A页面（未encode的页面）-> B页面 ->按返回键回退到修改前的A页面
原因：
首先要清楚，ios按下回退键：

1. 默认会将返回的链接encode
2. 且优先从缓存读取，无缓存或缓存过期才会刷新页面
3. 因为缓存是将页面链接作为关键字key的，所以encode和未encoded的链接取到的是2份不一样的缓存
4. 结果造成每次修改A页面，但是回退回来的时候总是旧版本，不是最新修改后的A页面

所以客户端的链接参数务必要encode,不然会带来不必要的麻烦