Zepto實(shí)現(xiàn)密碼的隱藏/顯示
更新時間：2017年04月07日 08:31:03 作者：DarkNight
本文主要介紹了js中隱藏/顯示密碼的Zepto的相關(guān)知識。具有很好的參考價值。下面跟著小編一起來看下吧
效果圖：
代碼如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="http://www.xipwang.cn/js/zepto.min.js"></script>
</head>
<body>
<div class="ui-password">
<input type="password" name="" class="passwords">
<button class="seepassword" >查看密碼</button>
</div>
<script type="text/javascript">
$(function(){
(function(){
$.fn.showpassWord = function () { //查看密碼
function Seepasswrod(elemnts) {
this.elemnts = elemnts;
this.init();
};
Seepasswrod.prototype = {
init: function () {
var m = this
this.shouEvent(m);
},
shouEvent: function (m) {
m.elemnts.on("tap click", function () {
var type = m.elemnts.parent().find(".passwords").attr("type");
if (type == "password") {
m.elemnts.parent().find(".passwords").attr("type", "text");
} else if (type == "text") {
m.elemnts.parent().find(".passwords").attr("type", "password");
}
});
},
};
return this.each(function () {
new Seepasswrod($(this))
});
};
})(Zepto);
$(".seepassword").showpassWord();
});
</script>
</body>
</html>
以上就是本文的全部內(nèi)容，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，同時也希望多多支持腳本之家！
您可能感興趣的文章:
- zepto.js中tap事件阻止冒泡的實(shí)現(xiàn)方法
- zepto中使用swipe.js制作輪播圖附swipeUp,swipeDown不起效果問題
- zepto與jquery的區(qū)別及zepto的不同使用8條小結(jié)
- 基于zepto.js實(shí)現(xiàn)仿手機(jī)QQ空間的大圖查看組件ImageView.js詳解
- 基于zepto的移動端輕量級日期插件--date_picker
- 基于zepto.js簡單實(shí)現(xiàn)上傳圖片
- 移動端翻頁插件dropload.js（支持Zepto和jQuery）
- jQuery插件zepto.js簡單實(shí)現(xiàn)tab切換
相關(guān)文章
JavaScript實(shí)現(xiàn)時間格式的切割與轉(zhuǎn)換
這篇文章主要為大家詳細(xì)介紹了使用JavaScript實(shí)現(xiàn)時間格式的切割與轉(zhuǎn)換的相關(guān)知識,文中的示例代碼講解詳細(xì),有需要的小伙伴可以參考一下2024-04-04
這篇文章主要介紹了小試小程序云開發(fā)(小結(jié))，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-06-06
eval() 函數(shù)計算 JavaScript 字符串，并把它作為腳本代碼來執(zhí)行，本文給大家2015-12-12
最近在學(xué)習(xí)JavaScript，因此想到使用js實(shí)現(xiàn)表單校驗。下面通過本文給大家分享使用javascript實(shí)現(xiàn)表單校驗功能的步驟，需要的的朋友參考下吧2017-08-08
用jscript實(shí)現(xiàn)獲取登錄時間的腳本2008-05-05
JavaScript中運(yùn)算符規(guī)則和隱式類型轉(zhuǎn)換示例詳解
JavaScript中運(yùn)算符規(guī)則的隱式類型轉(zhuǎn)換是什么? 這是每個學(xué)習(xí)Javascript的新手們都應(yīng)該知道的一個問題，下面這篇文章主要給大家介紹了關(guān)于JavaScript中運(yùn)算符規(guī)則和隱式類型轉(zhuǎn)換的相關(guān)資料，需要的朋友可以參考借鑒，下面來一起看看吧。2017-09-09
下面小編就為大家?guī)硪黄狫S轉(zhuǎn)換HTML轉(zhuǎn)義符的方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-08-08
這篇文章主要介紹了微信小程序前端promise封裝代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-08-08
非IE瀏覽器“userdata”的解決方案2009-06-06
這篇文章主要介紹了js操縱dom生成下拉列表框的方法,需要的朋友可以參考下2014-02-02