1.ios系統(tǒng)元素懸浮滑動(dòng)顯示錯(cuò)亂

今天測(cè)試同學(xué)給我找了一個(gè)bug，好家伙，本來就是一個(gè)普普通通的懸浮效果

但是在ios 15上滑動(dòng)的時(shí)候，懸浮圖片居然分身了.....，

經(jīng)過測(cè)試發(fā)現(xiàn)新版的iphone會(huì)有這個(gè)問題，老板的iphone（iphone6，iphone8）和安卓測(cè)試測(cè)試沒有這個(gè)問題，一看就就是踩中了新版ios的彩蛋，修復(fù)ios當(dāng)時(shí)是不可能的我們只能從我們的頁面上去處理。

????????接下來開始排查，經(jīng)過排查發(fā)現(xiàn)，懸浮元素里層的元素一開始是空div，a標(biāo)簽和img是調(diào)接口后異步渲染進(jìn)來的封裝到組件庫的。

<div class="float"><a href="#"><img src="xxx"></a> </div>

元素寫死的話不會(huì)有這個(gè)問題，但是這個(gè)功能暫時(shí)還不能動(dòng)，于是看能否跳過這個(gè)問題。最后發(fā)現(xiàn)把div設(shè)置一個(gè)背景色，問題就好了，但是頁面的背景色設(shè)置可配置的，這個(gè)方案很顯然不行，最后嘗試把定位屬性往里放一層，放到動(dòng)態(tài)添加進(jìn)來的a標(biāo)簽上，居然就好了。

<div ><a href="#" class="float"><img src="xxx"></a> </div>

開發(fā)中ios出現(xiàn)稀奇古怪的問題還是很常見的，需要不停的去調(diào)整頁面的實(shí)現(xiàn)方案來避開坑。

2 safari瀏覽器頁面無故刷新

剛好前兩天也到一個(gè)奇怪的問題，我們有個(gè)表單頁面，在填寫表單的時(shí)候在ios里會(huì)突然莫名奇妙的刷新，然后顯示頁面白屏出現(xiàn)“xxxx重復(fù)出現(xiàn)問題”后來經(jīng)過排查發(fā)現(xiàn)是因?yàn)轫撁嬷杏幸粋€(gè)省市區(qū)街道四聯(lián)動(dòng)的控件，在頁面中可以添加10個(gè)地址，由于組件封裝的時(shí)候把輸入框和地址選擇彈窗封裝到一起的原因，導(dǎo)致此添加一個(gè)地址都會(huì)渲染一個(gè)完整的地址控件，然后精確到街道的數(shù)據(jù)信息也比較多，就會(huì)造成頁面dom數(shù)量劇增，內(nèi)存占用率高，觸發(fā)了safari的刷新策略。后來把省市區(qū)街道彈窗抽離出來復(fù)用，解決了問題。

總結(jié)

以上是生活随笔為你收集整理的ios系统元素悬浮滑动错乱，和ios页面无故刷新问题的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。