javascript - 将文本类型输入更改为格式化密码
问题描述
我有一个输入文本类型,当我开始在输入中写一些内容以格式化密码时,我想更改格式。
这是我的html:
<div class="px-0 col-5">
<label class="px-0 col-12 mdc-text-field">
<input type="text" class="mdc-text-field__input" style="padding-left: 20px;" name="PWDDossier" id="PWDDossier" value="" />
<span class="mdc-floating-label" style="padding-left: 20px;">Mot de passe</span>
<div class="mdc-text-field__bottom-line"></div>
<i class="material-icons">
visibility
</i>
</label>
@Html.ValidationMessageFor(m => m.PWDDossier, "", new { @class = "text-danger" })
</div>
解决方案
当用户在输入中输入内容时,这会导致输入类似于密码输入(但仍然是文本输入)。
function make_pw(){
$("#PWDDossier").addClass("pwd");
}
.pwd{
-webkit-text-security: disc;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="px-0 col-5">
<label class="px-0 col-12 mdc-text-field">
<input type="text" class="mdc-text-field__input" style="padding-left: 20px;" name="PWDDossier" id="PWDDossier" value="" onkeydown="make_pw()" />
<span class="mdc-floating-label" style="padding-left: 20px;">Mot de passe</span>
<div class="mdc-text-field__bottom-line"></div>
<i class="material-icons">
visibility
</i>
</label>
</div>
推荐阅读
- idl - IDL 和图像格式
- azure-devops - 挂在编辑上的 Azure DevOps 选项卡
- javascript - 如何在Javascript中动态填充对象中的按钮?
- flutter - 为什么在调整浏览器窗口大小时多次调用 WidgetsBinding
- android - 在 vonage opentok 视频通话进行时获取电话接听和结束事件?
- python - 在 sqlalchemy 中删除具有依赖关系的表
- r - R库安装和位置问题
- react-native - ScrollTo 自定义键盘的当前文本输入
- c# - 如何使用 Wix/Wix 在对话框之间执行部分设置#
- string - 将字符串 (cm) 计算为 (inch)