自己處理事件並繪製文本框，iOS 因無法操作鍵盤只能藉助 input 元素。
然而：
1. 若 input 完全不顯示，則無法獲得焦點；
2. 即便是隱藏，光標依舊可見；
3. 移出文檔區(qū)域會導(dǎo)致事件響應(yīng)十分緩慢，iOS8 Safari 無此 bug，但 UIWebView 問題依舊；
4. 保留在文檔區(qū)域內(nèi)但不在可視範圍內(nèi)會自動滾動頁面且無法屏蔽，setTimeout 嘗試恢復(fù)會閃爍；
5. 縮小文本框尺寸到 0 會隱藏光標，但同時無法獲知光標位置（不爲 0 但很小則可以），且對 iOS8 Safari 無效；
貌似 iOS7 與 iOS8 的 UIWebView 表現(xiàn)類似，但是版本號不同；iOS8 Safari 與前兩者不同但版本號與 iOS8 UIWebView 相同。
感覺只能針對特定版本來實現(xiàn)，但更新會影響版本號，沒辦法全部測試。不知道 iOS6 的情況。
2
0
0
小伙看你根骨奇佳，潛力無限，來學(xué)PHP伐。
問題解決了~
實測8.1.1和7.1.2，
特性：
2
1113.input-container{
width: 100%; //或者input容器寬度
input{
text-indent: -999em; // 隱藏input文字
margin-left: -100%;// 隱藏input光標
width: 200%; // 保留inputDOM在頁面可視區(qū)域內(nèi)
}
label{
// 這里面自定義樣式，或者你在任意的dom上面自定義樣式都可以
}
}
問題已解決。
https://bumfo.github.io/l.html
核心代碼：
<!DOCTYPE HTML>
<title>Hide</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
input {
width: 0;
height: 0;
border: 1px solid red;
font-size: 1px;
text-indent: -20px;
opacity: 0;
}
</style>
<input id="q">
<label for="q">Input</label>
<script>
var l = document.querySelector("label");
document.querySelector("input").addEventListener("input", function(e) {
l.textContent = e.target.value || "Input";
});
</script>
原理分析：
iOS8 的 Safari 支持在 input 外面顯示光標，因此之前修改 input 尺寸的方法無效；
iOS7 不支持在 input 外面顯示光標，某些情況下，光標位於視圖外會導(dǎo)致響應(yīng)極其緩慢，但這時修改 input 尺寸的方法有效。
另外，若 input 尺寸（包括 border）有一項爲 0，在某些情況會出現(xiàn)無法獲取光標位置的問題。
綜上：
解決方案：
微信掃碼
關(guān)注PHP中文網(wǎng)服務(wù)號
技術(shù)交流群
QQ掃碼
加入技術(shù)交流群
Copyright 2014-2025 http://ipnx.cn/ All Rights Reserved | php.cn | 湘ICP備2023035733號
收藏
