移動端開發遇到的幾個問題

標籤：

1.iPhone下非a標籤使用$.fn.on委託綁定沒有作用。

　　處理方案，給標籤加上cursor屬性

.event{    cursor:pointer;}

 

2.移動端使用iframe載入跨域網頁出現“Refused to display in a frame becuase it set ‘X-Frame-Options‘ to ‘SAMEORIGIN”

　　本人使用的跨域頁面是移動官網"http://wap.10086.cn/",如果使用pc地址"http://www.10086.cn/"則不會發生此問題。

　　原因：出於安全考慮，有的網站屏蔽了外部iframe的調用，比如上面的移動的移動端網頁wap,而移動pc端則沒有屏蔽。

　　解決方案：

　　在網上找解決方案，但是沒有找到真正有用的。有幾個方法被網友認為可行，但是我這裡也沒有用，詳見http://stackoverflow.com/questions/20498831/refused-to-display-in-a-frame-because-it-set-x-frame-options-to-sameorigin

　　如果支援前端來說，這個應該是沒有解決方案的，畢竟要訪問的網頁不是自己的。唯一的辦法是讓背景同事幫忙使用預設瀏覽器開啟這個網站。

 

3. webview中 sumsung手機使用margin-left:auto;margin-right:auto;來實現水平置中會導致該置中元素的寬度設定失效，寬度會自動填滿置中地區。

　　解決方案：定位+左距離50%+左位移元素寬度的一半

.center{position:relative;left:50%;margin-left:-100px;}

 

4.webview中 sumsung定義高度不起作用

　　解決方案：逼不得已使用padding撐起高度

 

5.webview中 sumsung margin-left不起作用

　　解決方案：逼不得已使用padding-left

 

 

　　推薦幾篇博文：

　　移動端開發需要注意的一些事

　　移動前端的一些坑和解決方案（外觀表現）

　　

移動端開發遇到的幾個問題