在寫HTML5手機頁面的時候,有時候會寫到一些標簽是需要用戶長按然后放開的
但是微信里面長按就會出現復制,大大影響了用戶體驗,那么如何可以避免呢?
我也是最近寫到這樣的頁面,總結了一部分,大家可以作為參考
1.有一個按鈕,用戶需要長按它說話,但是顯示在微信里面的網頁,長按會出現復制的菜單,造成用戶體驗不流暢。像下圖這樣
2.這個按鈕我是用a標簽寫的,在a標簽里面加一句代碼
ontouchstart = "return false;"
這個方法,安卓和蘋果系統都可以用,個人比較喜歡這個,其中return false;可以替換為js函數,直接進行調用
3.上面的方法阻止的是一個按鈕區域的長按復制,但是其他地方還有有的,像下圖這樣
4.那么怎樣可以阻止當前頁面的微信長按復制
在css樣式表里面加入如下代碼
*{
-webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
-o-user-select:none;
}
但是這個方法,對安卓系統不適用,蘋果系統適用,我都試過
5.如果實在沒辦法,可以讓用戶在瀏覽器中打開,就沒有這樣長按復制的,可以寫個頁面告訴用戶,點擊右上角——瀏覽器中打開
6.在普通瀏覽器中是沒有這樣的問題的,不過我還是喜歡第一種方法