1. 程式人生 > >【ionic+angularjs】iphone手機點選穿透問題的解決

【ionic+angularjs】iphone手機點選穿透問題的解決

在用ionic+angularjs開發頁面時,出現點選穿透的現象,先來描述下我的現象:
開發頁面A的頭部是input的框(搜尋框),頁面B的頭部是文字描述,左邊有返回按鈕,在頁面A中點選某元素可以跳轉到頁面B,然後點選頁面B的返回按鈕可以返回到頁面A。想象來了,點選頁面B的返回按鈕,在返回到頁面A之後,居然頭部的搜素框設定焦點並彈出的輸入法鍵盤,然而我並沒有點選呢,why?有點懵圈。

有問題就得分析解決問題:
1、考慮過事件阻止以及冒泡
2、考慮過div層的事件點選問題
然並卵!繼續百度吧,發現“點選穿透”的概念,發現一個好博文,讓人豁然開朗!連結如下:
http://blog.csdn.net/alex8046/article/details/52299785

按照博文中的解決方法,採用延時的方式,元素繫結on-tap事件,採用$timeout解決問題(PC上未測試)。

後又發現比較好的解決方法:

在點選元素上設定屬性:data-tap-disabled="true",事件繼續繫結ng-click,不使用$timeout,完美解決。

以上,請大家糾正與討論,謝謝!