Javascript 如何使用Html助手在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

我正在使用这个,我希望这里应该是一个按钮,我点击,密码变得可见。我知道这将通过jquery或Javascript实现,但在mvc中我无法理解这一点。如何在mvc中应用该技术

@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"
}