默認(rèn)密碼隱藏起來(lái)(顯示為點(diǎn)),后面的圖標(biāo)是閉眼;用戶(hù)點(diǎn)擊圖標(biāo)后,圖標(biāo)變成睜眼,同時(shí)把密碼明文顯示出來(lái);如此循環(huán)
Page({
data: {
passwordType: true, // 切換是否密碼框
show_pass: false // 是否顯示密碼
}
})
<text class="page-flex-password">設(shè)置密碼</text>
<view class="page-flex-row3">
<input name="password" class="page-input2" placeholder-class="place-holder" placeholder="請(qǐng)輸入您要設(shè)置的密碼(6-12位)" password="{{passwordType}}"></input>
<image class="password-icon" src="../../images/register/xianshi.png" bindtap="seeTap" wx:if="{{show_pass}}"/>
<image class="password1-icon" src="../../images/register/yincnang.png" bindtap="seeTap" wx:else/>
</view>
用戶(hù)點(diǎn)擊圖標(biāo)時(shí):文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-676648.html
seeTap:function(){
var that = this
that.setData({
show_pass:!that.data.show_pass, // 切換圖標(biāo)
passwordType:!passwordType, // 切換是否密碼框
})
},
參考:
小程序?qū)崿F(xiàn)密碼交替顯示隱藏的效果
在微信小程序里,實(shí)現(xiàn)點(diǎn)擊框里的眼睛圖標(biāo)時(shí)密碼顯示與隱藏切換文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-676648.html
到了這里,關(guān)于小程序密碼顯示與隱藏的實(shí)現(xiàn)的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!