移動端的input都不能輸入了,后來發(fā)現(xiàn)是
-webkit-user-select :none ;
在移動端開發(fā)中,我們有時有針對性的寫一些特殊的重置,比如:
<pre>
* {
-webkit - touch - callout: none;
//-webkit-touch-callout:none; 阻止長按圖片之后呼出菜單提示復(fù)制的行為
//禁用Webkit內(nèi)核瀏覽器的文字大小調(diào)整功能。
-webkit-text-size-adjust: none;
//避免點(diǎn)擊a標(biāo)簽或者注冊了click事件的元素時產(chǎn)生高亮
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
//
//禁止用戶進(jìn)行復(fù)制.選擇.
-webkit-user-select: none;
}
其中,-webkit-user-select :none ;會產(chǎn)生一些問題。
如果網(wǎng)站不需要阻止用戶的選擇內(nèi)容的行為就可以使用如下樣式:
<pre>
{
-webkit-user-select: text;
-user-select: text;
}
另一種方式:
<pre>
. {
-webkit-user-select: text;
-user-select: text;
}
</pre>
另一種方式:
<pre>
*:not(input.textarea){
-webkit - touch - callout: none;
-webkit - user - select: none;
}
</pre>
user-select , can cause issues in elements with contenteditable="true" ,so better to add that too .
所以,最好把它也加上
最終的代碼:
<pre>
[contenteditable = "true"], input, textarea {
-webkit-user- select: auto!important;
-khtml-user-select: auto!important;
-moz-user-select: auto!important;
-ms-user-select: auto!important;
-o-user-select: auto!important;
user-select: auto!important;
}
</pre>