IOS11下fixed中input游標錯位問題

2022-02-21 13:59:20 字數 3113 閱讀 9694

專案遇到了這個問題,故作了個臨時解決方案,暫時沒有想到更好的方法,查閱了網上的方案,也沒有找到完美的解決方案。

方案思路:

①彈窗開啟時,阻止 body 滾動,禁用 touchmove ,同時記錄當前 body 的滾動高度 startscrolltop

②彈窗關閉時,恢復 body 滾動,同時給當前滾動條賦值 startscrolltop ,恢復到彈窗前的高度

③關閉輸入鍵盤時,同樣恢復到彈窗前的高度

實現的**如下:

doctype html

>

<

html

>

<

head

>

<

meta

charset

="utf-8"

>

<

title

>ios11游標錯位問題

title

>

<

meta

name

="viewport"

content

="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"

>

<

script

src=""

>

script

>

<

style

type

="text/css"

>

.wrap

button

.fixed

.mask

input

.abs

style

>

head

>

<

body

>

<

h2>頂部

h2>

<

div

class

="wrap"

>

<

button

type

="button"

name

="button"

onclick

="showdialog()"

>show dialog

button

>

<

button

type

="button"

name

="button"

onclick

="showdialog()"

>show dialog

button

>

<

button

type

="button"

name

="button"

onclick

="showdialog()"

>show dialog

button

>

div>

<

div

class

="fixed"

id="dialog"

style

="display: none;"

>

<

div

class

="mask"

onclick

="hidedialog()"

>

div>

<

div

class

="abs"

>

<

div><

input

type

="text"

onfocus

="getdialogscrolltop()"

onblur

="setdialogscrolltop()"

name

=""value

="">

div>

<

div><

input

type

="text"

onfocus

="getdialogscrolltop()"

onblur

="setdialogscrolltop()"

name

=""value

="">

div>

<

div><

input

type

="text"

onfocus

="getdialogscrolltop()"

onblur

="setdialogscrolltop()"

name

=""value

="">

div>

div>

div>

<

h2>底部

h2>

<

script

>

varstartscrolltop =0

;

function

showdialog()

function

hidedialog()

//取消預設事件

function

stoppreventdefault(e)

//新增 touchmove 事件 禁用滾動條滾動

function

disabledscroll()

//取消 touchmove 事件 還原滾動條滾動,同時還原小鍵盤開啟前的滾動高度

function

enabledscroll()

//獲取當前滾動高度並賦值到 startscrolltop

function

getdialogscrolltop()

//還原滾動高度

function

setdialogscrolltop() );

document.body.scrolltop

=startscrolltop

}script

>

body

>

html

>

iOS11中的定位授權

1,增加nslocationwheninuseusagedescription。2,建立cllocationmanager物件,在使用定位服務前呼叫requestwheninuseauthorization 3,通過func locationmanager manager cllocationman...

iOS 11開發教程(四)iOS11模擬器介紹一

在圖1.6或者1.7中所看到的類似於手機的模型就是ios模擬器。ios模擬器是在沒有iphone或ipad裝置時,對程式進行檢測的裝置。ios模擬器可以模 實的iphone或ipad等裝置的一些功能。本小節將講解一些有關模擬器的操作。1.模擬器與真機的區別 ios模擬器可以模 實的iphone或ip...

問題 iOS 11 定位問題

ios11 定位許可權未通過,控制台輸出以下資訊 在 info.plist 檔案新增乙個 nslocationalwaysandwheninuseusagedescription 和 nslocationwheninuseusagedescription 的 key,然後新增描述。定位失敗,方法lo...