久久r热视频,国产午夜精品一区二区三区视频,亚洲精品自拍偷拍,欧美日韩精品二区

您的位置:首頁技術(shù)文章
文章詳情頁

javascript - ios input聚焦時,頁面整個被推上去了

瀏覽:132日期:2022-11-04 15:48:22

問題描述

需求其實很簡單。就是在頁面的底部固定一個input框,然后輸入文字就可以了。 可是。。。在ios系統(tǒng)下。當這個input被聚焦時,整個頁面都被頂上去了。。。。。。頭部的內(nèi)容都看不見了。請問各位有木有什么好辦法可以只讓這個input框被頂上去,頁面其他元素的位置不變?

tips:已經(jīng)在網(wǎng)上查了好多,可是都解決不了 T.T然后我試著干脆在input focus的時候把整個頁面的position改成fixed,top:0;bottom:0;然后這樣的話頁面確實沒有被頂上去了,可是input也不上去了,被那個鍵盤擋住了

<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>scroll</title><meta name='viewport' content='width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no'><style> .btm{ position: fixed ; bottom:0; }</style></head><body> <p id=’inp’><p class='content'> 內(nèi)容</p><p class='btm'> <input type='text'></p> </p> <script> </script></body></html>

問題解答

回答1:

禁止input框獲取聚焦, 在點擊input后, 獲取keyboard彈出事件并且在keyboard上添加toolbar, 新建input框加入到toolbar上, 在鍵盤收回時, 獲取到toolbar上的input框中內(nèi)容賦值到頁面input上.javascript - ios input聚焦時,頁面整個被推上去了

回答2:

當input聚焦,把input改成fixed定位就可以了

position: fixed;bottom: 0;回答3:

這個問題還算好點,如果你的內(nèi)容有滾動時候,在ios點擊fixed的input會發(fā)現(xiàn)跑到中間了。需要解決:

.wrap{ position:fixed; top:0; bottom: 0; left:0; overflow-y: scroll; width:100%; } <p id=’inp’> <p class='content'>內(nèi)容 </p></p><p class='btm'> <input type='text'></p>

讓內(nèi)容塊設(shè)置為fixed就好,目前樓主的問題,暫時沒有很好解決方案,提供個替代方案:footer里面不直接放input,而是一個偽input,點擊時彈出一個新層,如:http://zhibo.m.sohu.com/r/121...

標簽: JavaScript
主站蜘蛛池模板: 凌云县| 思茅市| 韶山市| 雷州市| 理塘县| 甘肃省| 林西县| 鹿泉市| 中山市| 无为县| 廊坊市| 普洱| 汝州市| 新巴尔虎左旗| 焦作市| 江安县| 临邑县| 通海县| 读书| 平顶山市| 吉木萨尔县| 云浮市| 会泽县| 曲周县| 塔河县| 竹溪县| 龙泉市| 宜昌市| 海伦市| 绍兴市| 稷山县| 富川| 无极县| 冕宁县| 忻城县| 德安县| 明星| 洞口县| 恭城| 瑞安市| 金川县|