IOS上微信小程序密碼框光標(biāo)離開提示存儲(chǔ)密碼的完美解決方案
問題：
ios密碼框輸入密碼光標(biāo)離開之后會(huì)提示存儲(chǔ)密碼的彈窗
解決方案
1、在蘋果手機(jī)上面把 “自動(dòng)填充密碼”關(guān)閉，但是蘋果這個(gè)默認(rèn)開啟，而且大部分客戶也不會(huì)去自己關(guān)閉。
2、欺騙蘋果手機(jī)，代碼實(shí)現(xiàn)。
先說解決思路，通過測(cè)試發(fā)現(xiàn)，在賬號(hào)框不為空，密碼框不為空，兩者都不為空，并且光標(biāo)離開賬號(hào)框或者密碼框的時(shí)候，蘋果系統(tǒng)會(huì)自動(dòng)提示存儲(chǔ)密碼或者更新密碼的提示。又經(jīng)過大量測(cè)試發(fā)現(xiàn)，賬號(hào)輸入框是指的距離密碼輸入框最近的上一個(gè)輸入框，因此解決辦法就是在密碼輸入框上面增加一個(gè)賬號(hào)輸入框，讓他永遠(yuǎn)為空，并且不可見即可（頁面不可見,不能是display:none）。
這樣距離密碼框最近的上一個(gè)文本框永遠(yuǎn)是空的，就不會(huì)觸發(fā)ios的存儲(chǔ)密碼提示了。
代碼如下:
<view class="form-box"> <view class="item"> <text class="title">賬號(hào)</text> <input class="input" placeholder="請(qǐng)輸入賬號(hào)" :value="username" @input="inputName" placeholder-style="font-size:28rpx;color:#c2c2c7" /> </view> <!-- 內(nèi)容永遠(yuǎn)為空 --> <view> <input disabled="true" value="" ></input> </view> <view class="item"> <text class="title">密碼</text> <view class="input-box"> <input class="input" id="password" @input="inputPassword" placeholder="請(qǐng)輸入密碼" :password="!showPassword" placeholder-style="font-size:28rpx;color:#c2c2c7" /> <view class="eye-box" @click="changeEyeStatus()" v-if="password"> <img :src="showPassword?openEye:closeEye" class="icon"> </view> </view> </view> <view class="login-btn" @click="login"> <text>登錄</text> </view> <view class="check_code" @click="checkCode"> <text >短信驗(yàn)證登錄</text> </view> </view>
密碼輸入框上面的一個(gè)輸入框 value值永遠(yuǎn)為空，這樣就不會(huì)觸發(fā)儲(chǔ)存密碼的彈窗啦~
到此這篇關(guān)于IOS上微信小程序密碼框光標(biāo)離開提示存儲(chǔ)密碼解決方案的文章就介紹到這了,更多相關(guān)IOS微信小程序密碼框存儲(chǔ)密碼內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
在現(xiàn)代前端開發(fā)中,拖拽功能是增強(qiáng)用戶體驗(yàn)的重要手段之一,本文將詳細(xì)介紹如何在Vue3中封裝一個(gè)拖拽指令并通過實(shí)戰(zhàn)例子演示其實(shí)現(xiàn)過程,希望對(duì)大家有所幫助2024-11-11
Vue-cli3生成的Vue項(xiàng)目加載Mxgraph方法示例
這篇文章主要介紹了Vue-cli3生成的Vue項(xiàng)目加載Mxgraph方法示例，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-05-05
使用Vue3實(shí)現(xiàn)交互式雷達(dá)圖的代碼實(shí)現(xiàn)
雷達(dá)圖是一種可視化數(shù)據(jù)的方式,用于比較多個(gè)類別中不同指標(biāo)的相對(duì)值,它適用于需要展示多個(gè)指標(biāo)之間的關(guān)系和差異的場(chǎng)景,本文給大家介紹了如何用Vue3輕松創(chuàng)建交互式雷達(dá)圖,需要的朋友可以參考下2024-06-06
Vue判斷字符串(或數(shù)組)中是否包含某個(gè)元素的多種方法
在我們前端日常開發(fā)中經(jīng)常會(huì)遇到判斷一個(gè)字符串中是否包含某個(gè)元素的需求,下面這篇文章主要給大家介紹了關(guān)于Vue判斷字符串(或數(shù)組)中是否包含某個(gè)元素的多種方法,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-09-09
EPUB.js是一個(gè)基于JavaScript的庫,用于從電子書中提取內(nèi)容,這篇文章主要為大家詳細(xì)介紹了vue如何使用epubjs實(shí)現(xiàn)電子書的功能,感興趣的小伙伴可以學(xué)習(xí)一下2023-11-11
Pinia實(shí)現(xiàn)數(shù)據(jù)持久化存儲(chǔ)實(shí)踐
安裝pinia-plugin-persist插件,引入并掛載后啟用數(shù)據(jù)緩存（默認(rèn)存入sessionStorage）,可通過paths自定義持久化字段,未指定的state將不進(jìn)行緩存2025-07-07
vue中三種插槽(默認(rèn)插槽/具名插槽/作用域插槽)的區(qū)別詳解
默認(rèn)插槽，具名插槽，作用域插槽是vue中常用的三個(gè)插槽，這篇文章主要為大家介紹了這三種插槽的使用與區(qū)別，感興趣的小伙伴可以了解一下2023-08-08
使用Vue+Django+Ant Design做一個(gè)留言評(píng)論模塊的示例代碼
這篇文章主要介紹了使用Vue+Django+Ant Design做一個(gè)留言評(píng)論模塊，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-06-06
這篇文章簡(jiǎn)單給大家介紹了Vue項(xiàng)目中使用keep-Alive步驟，在vue2.1.0之前，實(shí)現(xiàn)方式也給大家作了簡(jiǎn)單介紹，感興趣的朋友跟隨腳本之家小編一起看看吧2018-07-07
在Vue2到Vue3的升級(jí)過程中,除了響應(yīng)式系統(tǒng)、組件寫法等發(fā)生了變化,全局 API 的轉(zhuǎn)移也是一個(gè)非常重要的點(diǎn),很多初學(xué)者在遷移代碼時(shí)會(huì)遇到報(bào)錯(cuò),就是因?yàn)閂ue3不再像Vue2那樣把所有API掛在Vue構(gòu)造函數(shù)上了,本文就來詳細(xì)講解一下Vue的全局API轉(zhuǎn)移,需要的朋友可以參考下2025-09-09