這篇文章主要介紹js怎么實(shí)現(xiàn)input密碼框顯示/隱藏功能，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

成都創(chuàng)新互聯(lián)公司-專(zhuān)業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性?xún)r(jià)比淥口網(wǎng)站開(kāi)發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫(kù),直接使用。一站式淥口網(wǎng)站制作公司更省心,省錢(qián),快速模板網(wǎng)站建設(shè)找我們，業(yè)務(wù)覆蓋淥口地區(qū)。費(fèi)用合理售后完善，十載實(shí)體公司更值得信賴(lài)。js有什么特點(diǎn)

1、js屬于一種解釋性腳本語(yǔ)言；2、在絕大多數(shù)瀏覽器的支持下，js可以在多種平臺(tái)下運(yùn)行，擁有著跨平臺(tái)特性；3、js屬于一種弱類(lèi)型腳本語(yǔ)言，對(duì)使用的數(shù)據(jù)類(lèi)型未做出嚴(yán)格的要求，能夠進(jìn)行類(lèi)型轉(zhuǎn)換，簡(jiǎn)單又容易上手；4、js語(yǔ)言安全性高，只能通過(guò)瀏覽器實(shí)現(xiàn)信息瀏覽或動(dòng)態(tài)交互，從而有效地防止數(shù)據(jù)的丟失；5、基于對(duì)象的腳本語(yǔ)言，js不僅可以創(chuàng)建對(duì)象，也能使用現(xiàn)有的對(duì)象。

JavaScript實(shí)現(xiàn)input密碼框顯示/隱藏的功能，供大家參考，具體內(nèi)容如下

實(shí)現(xiàn)代碼：

 
 
 .password{
  position: relative;
  width: 280px;
  height: 60px;
 }
 .password,.n-txtCss{
  display: flex;
  align-items: center;
 }
 .password .fa{
  position: absolute;
  right: 10px;
  top:15px;
  font-size: 20px;
  cursor: pointer;
 }

  .fa-eye-slash{
  margin-top: 6px;
  margin-left: 7px;
  width: 24px;
  height: 20px;
  background-image: url(./vivo_img/login/eye-password.png);
  background-repeat: no-repeat;
  background-size: 24px 17px;
 }
 .fa-eye{
  margin-top: 6px;
  width: 24px;
  margin-left: 7px;
  height: 20px;
  background-image: url(./vivo_img/login/eye-password-active.png);
  background-repeat: no-repeat;
  background-size: 24px 17px;

 }

 
 



 
 
 
 

 $(".password").on("click", ".fa-eye-slash", function () {
 $(this).removeClass("fa-eye-slash").addClass("fa-eye");
 $(this).prev().attr("type", "text");
 });
 
 $(".password").on("click", ".fa-eye", function () {
 $(this).removeClass("fa-eye").addClass("fa-eye-slash");
 $(this).prev().attr("type", "password");
 });

以上是“js怎么實(shí)現(xiàn)input密碼框顯示/隱藏功能”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

標(biāo)題名稱(chēng)：js怎么實(shí)現(xiàn)input密碼框顯示/隱藏功能-創(chuàng)新互聯(lián)
網(wǎng)址分享：http://weahome.cn/article/pseod.html