快捷導(dǎo)航

使用scrollTop(）解決IOS中輸入法遮擋輸入框問題

更新時(shí)間：2017年09月27日 14:03:14 作者：背包里的護(hù)身符

ios瀏覽器上輸入法會(huì)彈出遮擋輸入框問題，下面小編給大家分享scrollTop(）解決IOS中輸入法遮擋輸入框問題，一起看看吧

經(jīng)過測(cè)試，發(fā)現(xiàn)有的IOS瀏覽器上輸入法會(huì)彈出遮擋輸入框，網(wǎng)上很多都是介紹用以下方法

(function() { 
$(‘input').on(‘click', function () { 
var target = this; 
// 使用定時(shí)器是為了讓輸入框上滑時(shí)更加自然 
setTimeout(function(){ 
target.scrollIntoView(true); 
},100); 
});

但是由于本人對(duì)scrollIntoView的理解不夠一直沒有解決問題，后來用相同的思路使用scrollTop()解決了。

實(shí)例如下

<script language="javascript">`
$('#messageInput').on('click', function() {
// 使用定時(shí)器是因?yàn)檩斎敕ǖ膹棾鰰?huì)改變body的高度，所以延時(shí)1秒等輸入法彈出后再定位到滾動(dòng)條底部
    setTimeout(function() {
     $('body').scrollTop($('body')[0].scrollHeight);
    }, 1000);

});
</script>
<body>
<input type="text" id="messageInput" placeHolder="請(qǐng)輸入文字" />
</body>

總結(jié)

以上所述是小編給大家介紹的使用scrollTop(）解決IOS中輸入法遮擋輸入框問題，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

iOS中設(shè)置圓角的幾種方法示例
這篇文章主要介紹了iOS中設(shè)置圓角的三種方法，其中包括使用layer屬性、使用繪圖設(shè)置圓角以及通過另一張mask圖創(chuàng)建新圖，需要的朋友可以參考借鑒，下面來一起看看吧。
2017-03-03
詳解IOS圖片壓縮處理
在日常IOS開發(fā)中，感覺圖片尺寸太大，想壓縮成小一點(diǎn)像素的。那么該如何做呢？本文通過“壓縮”兩個(gè)概念及實(shí)例來告訴大家如何進(jìn)行圖片壓縮處理才是最好的。
2016-07-07
React Native學(xué)習(xí)教程之自定義NavigationBar詳解
這篇文章主要給大家介紹了關(guān)于React Native學(xué)習(xí)教程之自定義NavigationBar的相關(guān)資料，文中通過是示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。
2017-10-10
IOS 中UIKit-UIPageControl利用delegate定位圓點(diǎn)位置
這篇文章主要介紹了IOS 中UIKit-UIPageControl利用delegate定位圓點(diǎn)位置的相關(guān)資料,需要的朋友可以參考下
2017-04-04
iOS中使用MD5加密字符串
本文主要給大家講解的是在IOS中MD5的加密方式，及詳細(xì)使用方法。有需要的小伙伴可以參考下
2016-06-06
iOS高仿微信表情輸入功能代碼分享
最近項(xiàng)目需求，要實(shí)現(xiàn)一個(gè)類似微信的的表情輸入功能，今天小編抽空給大家分享iOS高仿微信表情輸入功能代碼，非常不錯(cuò)，感興趣的朋友參考下吧
2016-11-11
ios中圖像進(jìn)行壓縮方法匯總
在Iphone上有兩種讀取圖片數(shù)據(jù)的簡(jiǎn)單方法: UIImageJPEGRepresentation和UIImagePNGRepresentation. UIImageJPEGRepresentation函數(shù)需要兩個(gè)參數(shù):圖片的引用和壓縮系數(shù).而UIImagePNGRepresentation只需要圖片引用作為參數(shù).
2015-05-05
iOS 通用鏈接（Universal Link）配置詳解
這篇文章主要介紹了iOS 通用鏈接（Universal Link）配置詳解，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-11-11
iOS 8使用UIBlurEffect實(shí)現(xiàn)毛玻璃特效
這篇文章主要為大家詳細(xì)介紹了iOS 8使用UIBlurEffect類和UIVisualEffectView類實(shí)現(xiàn)毛玻璃特效，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2018-05-05
iOS如何將UIButton中的圖片與文字上下對(duì)齊詳解
對(duì)于UIButton實(shí)現(xiàn)上顯示圖片,下顯示文字這個(gè)需求估計(jì)各位iOS開發(fā)者們都不陌生，所以下面這篇文章主要給大家介紹了關(guān)于iOS如何將UIButton中圖片與文字上下對(duì)齊的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，需要的朋友可以參考借鑒，下面來一起看看吧。
2017-10-10