h5通過css實現禁止ios端長按復制選中文字的方法

在ios端默認的長按選擇，可以對文字進行復制粘貼。但是在實際開發中，針對一些按鈕一般要避免長按時彈出選中文字，或者一些罩層要避免彈出。 這篇文章通過css3實現禁止ios端長按復制選中文字的方法。

 

css代碼如下：

*{
-webkit-touch-callout:none; /*系統默認菜單被禁用*/
-webkit-user-select:none; /*webkit瀏覽器*/
-khtml-user-select:none; /*早期瀏覽器*/
-moz-user-select:none;/*火狐*/
-ms-user-select:none; /*IE10*/
user-select:none;
}

　　

Pexelshttps://www.wode007.com/sites/73241.html 天堂圖片網https://www.wode007.com/sites/73243.html

但是IOS上出現input、textarea不能輸入，因此將使用-webkit-user-select:auto;如下：

input,textarea {
    -webkit-user-select:auto; /*webkit瀏覽器*/
    margin: 0px;
    padding: 0px;
    outline: none;
}

　　

這樣就避免了蘋果手機上會導致input輸入框不能聚焦從而不能輸。當然一般不要輕易使用通配符*{}的方式，我們可以給定對應class名稱。