zoukankan      html  css  js  c++  java
  • angular+ionic的兼容性问题

    同学们在试用angular+ionic开发移动端时,由于安卓和苹果系统的不同,微信和其他浏览器的不同,会出现很多难以解决的bug,下面是我在项目中遇到的一些bug

    1、<ion-content class="zkht-callUp-container" overflow-scroll="false"></ion-content>

      overflow-scroll="false"遇到安卓上的微信页面会使识别二维码功能失效

      解决办法:overflow-scroll="true" 或者删除此属性

    2、div设置了overflow-y:scroll;,但是安卓微信版却显示的overflow-y:hidden;的效果,苹果的微信和浏览器以及安卓的自带浏览器都是scroll显示的,唯独安卓微信不行

      解决办法:http://www.cnblogs.com/JoannaQ/archive/2013/06/24/3151843.html

    3、<ion-content class="zkht-callUp-container" overflow-scroll="true"></ion-content>

      如果在a页面设置overflow-scroll="true" ,单独设置此属性会使苹果手机刚进入a页面可以实现滚动,但是a页面跳转到b页面再返回到a页面时滚动失效

      如果a页面还有横向滚动,overflow-scroll="false"会导致在安卓系统中横向滚动失效

    4、<input type="number">在ios手机中还可以输入非数字

      解决办法:<input type="number" onchange="this.value=this.value.replace(/[^0-9.]+/,'');">

      如果在angular中遇到此问题,请注意:

      <input type="number" onchange="this.value=this.value.replace(/[^0-9.]+/,'');" ng-model="formData.inputVal">

      当页面刚加载时,打印formData.inputVal为“”

      当输入数字,再删除所有输入内容时,打印formData.inputVal为null

      在这里不能使用oninput="this.value=this.value.replace(/[^0-9.]+/,'');"

      使用oninput会导致输入非数字+数字时,拿到的输入框值为空

      补充: 猜想可能是oninput和onchange的出发机制不同造成的,oninput是在输入是立即触发,onchange是在失去焦点时触发

    5、select插件在微信环境下出现无法点击显示下拉框

      解决方法: 在select的父元素中加入属性 data-tap-disabled="true"

  • 相关阅读:
    ojdbc14.jar
    Redis
    ftl转成word
    Swagger
    SpringBoot
    条件注解
    Spring SpringMVC MyBatis
    Spring介绍
    Django_mysql表查询
    Django01
  • 原文地址:https://www.cnblogs.com/cutone/p/6027710.html
Copyright © 2011-2022 走看看