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"


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM