Javascript 如何使用Html助手在mvc中显示密码隐藏字段
我正在使用这个,我希望这里应该是一个按钮,我点击,密码变得可见。我知道这将通过jquery或Javascript实现,但在mvc中我无法理解这一点。如何在mvc中应用该技术Javascript 如何使用Html助手在mvc中显示密码隐藏字段,javascript,c#,jquery,asp.net-mvc,asp.net-mvc-4,Javascript,C#,Jquery,Asp.net Mvc,Asp.net Mvc 4,我正在使用这个,我希望这里应该是一个按钮,我点击,密码变得可见。我知道这将通过jquery或Javascript实现,但在mvc中我无法理解这一点。如何在mvc中应用该技术 @Html.Password("pasword", null, new { @class = "form-control frmField", placeholder = "Password" }) 我用过这个,效果很好。如何在mvc中实现这一点 <input data-toggle="password" typ
@Html.Password("pasword", null, new { @class = "form-control frmField", placeholder = "Password" })
我用过这个,效果很好。如何在mvc中实现这一点
<input data-toggle="password" type="password" data-placement="after" data-eye-class="glyphicon" data-eye-open-class="glyphicon glyphicon-eye-open" data-eye-close-class="glyphicon glyphicon-eye-close" data-eye-class-position="true" class="form-control pwd">
<input type="text" class="form-control" placeholder="password" style="display:none;" />
只需将#密码替换为选择器,如果要将其更改回,只需执行以下操作:
$("#Password").attr("type","text")
将密码类型更改为文本类型
$(“.btnShow”).mousedown(函数(){
$(“.pwd”).attr(“类型”、“文本”);
});
$(“.btnShow”).on(“mouseleave”,function(){
$(“.pwd”).attr(“类型”、“密码”);
});代码>
在页面中添加javascript以实现它。这是一个样品供你参考
$("#Password").attr("type","password")
@Html.Password(“pasword”,null,新{@class=“form control frmField”,placeholder=“Password”})
$(“#显示隐藏密码”)。单击(函数(){
if($(this.val()=“Show”){
$(this.val(“隐藏”);
$(“#密码”).attr(“类型”、“文本”);
}否则{
$(this.val(“Show”);
$(“密码”).attr(“类型”、“密码”);
}
});
使用下面的行为密码字段分配一个Id
@Html.Password("pasword", null, new { @class = "form-control frmField", placeholder = "Password" })
<input type="button" id="showHidePassword" value="Show" />
<script>
$("#showHidePassword").click(function(){
if($(this).val() == "Show"){
$(this).val("Hide");
$("#password").attr("type", "text");
} else {
$(this).val("Show");
$("#password").attr("type", "password");
}
});
</script>
密码和文本框之间唯一的区别是html类型属性。使用jquery或javascript定位元素id,并将其类型更改为文本。
<input id="passwordField" data-toggle="password" type="password" data-placement="after" data-eye-class="glyphicon" data-eye-open-class="glyphicon glyphicon-eye-open" data-eye-close-class="glyphicon glyphicon-eye-close" data-eye-class-position="true" class="form-control pwd">
<input type="checkbox" onclick="ShowHidePass(this)" />
function ShowHidePass(objChk)
{
if(objChk.checked)
passwordField.type="text"
else
passwordField.type="password"
}