javascript - iOS Mobile Safari 隱藏光標
伊谢尔伦
伊谢尔伦 2017-04-10 14:45:19
[JavaScript讨论组]

自己處理事件並繪製文本框,iOS 因無法操作鍵盤只能藉助 input 元素。

然而:
1. 若 input 完全不顯示,則無法獲得焦點;
2. 即便是隱藏,光標依舊可見;
3. 移出文檔區域會導致事件響應十分緩慢,iOS8 Safari 無此 bug,但 UIWebView 問題依舊;
4. 保留在文檔區域內但不在可視範圍內會自動滾動頁面且無法屏蔽,setTimeout 嘗試恢復會閃爍;
5. 縮小文本框尺寸到 0 會隱藏光標,但同時無法獲知光標位置(不爲 0 但很小則可以),且對 iOS8 Safari 無效;

貌似 iOS7 與 iOS8 的 UIWebView 表現類似,但是版本號不同;iOS8 Safari 與前兩者不同但版本號與 iOS8 UIWebView 相同。

感覺只能針對特定版本來實現,但更新會影響版本號,沒辦法全部測試。不知道 iOS6 的情況。

伊谢尔伦
伊谢尔伦

小伙看你根骨奇佳,潜力无限,来学PHP伐。

全部回复(1)
巴扎黑

问题解决了~
实测8.1.1和7.1.2,
特性:

  • input可以换起键盘
  • input光标隐藏
  • input内容隐藏
  • 通过其他p或Label模拟input样式
.input-container{
  width: 100%; //或者input容器宽度

  input{
    text-indent: -999em; // 隐藏input文字
    margin-left: -100%;// 隐藏input光标
    width: 200%; // 保留inputDOM在页面可视区域内
  }

  label{
    // 这里面自定义样式,或者你在任意的dom上面自定义样式都可以
  }
}
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号