Javascript 使密码文本框值在每个字符输入后可见

Javascript 使密码文本框值在每个字符输入后可见,javascript,c#,jquery,html,asp.net,Javascript,C#,Jquery,Html,Asp.net,我有一个密码字段: <input class="form-control" type="password" name="password" required="required" /> 自然,当用户输入密码时,默认为******模式 但我想在这个字段中添加一些不同的内容,这意味着当用户输入密码中的任何字符时,它应该显示一段时间,然后将其转换为*** 我在Iphone上看到,当用户输入密码时,当前输入的字符会显示一段时间,然后转换成****。 如何在.net应用程序中执行此操作

我有一个密码字段:

 <input class="form-control" type="password" name="password" required="required" />

自然,当用户输入密码时,默认为******模式

但我想在这个字段中添加一些不同的内容,这意味着当用户输入密码中的任何字符时,它应该显示一段时间,然后将其转换为***

我在Iphone上看到,当用户输入密码时,当前输入的字符会显示一段时间,然后转换成****。 如何在.net应用程序中执行此操作? 请有人帮我解决这个问题
提前感谢。

此代码段将自动将您的密码输入字段转换为文本字段和一个与密码字段同名的隐藏字段

<input type="password" name="pass" class="pass" />

将转换为

<input type="text" class="pass" />
<input type="hidden" name="pass" class="hidpassw"/>

在这里,我没有将另一个转换为隐藏的演示目的。看看它是否适合你

函数createstars(n){
返回新数组(n+1)。联接(“*”)
}
$(文档).ready(函数(){
var timer=“”;
$(“.panel”)。追加($('');
$(.hidpassw”).attr(“名称”),$(.pass”).attr(“名称”);
$(.pass”).attr(“类型”、“文本”).removeAttr(“名称”);
$(“body”)。在(“按键”、“传递”功能上(e){
var代码=e.which;

如果(code>=32&&code只是一个想法,您可以在将可见输入内容转换为点的同时添加一个保存密码的隐藏字段

var showLength=3;
无功延迟=1000;
var hideAll=setTimeout(函数(){},0);
$(文档).ready(函数(){
$(“#密码”)。在(“输入”,函数()上){
var offset=$(“#password”).val().length-$(“#hidden”).val().length;
如果(偏移量>0)$(“#隐藏”).val($(“#隐藏”).val()+$(“#密码”).val().substring($(“#隐藏”).val().length,$(“#隐藏”).val().length+offset);
如果(偏移量<0)$(“#隐藏”).val($(“#隐藏”).val()。子字符串(0,$(“#隐藏”).val().length+offset));
//更改可见字符串
if($(this).val().length>showLength)$(this).val($(this).val().substring(0,$(this).val().length-showLength).替换(//g,“•”)+$(this).val().substring($(this).val().length-showLength,$(this).val().length));
//设置计时器
clearTimeout(hideAll);
hideAll=setTimeout(函数(){
$(“#密码”).val($(“#密码”).val()。替换(//g,“•”);
},延误);
});
});
#隐藏{
不透明度:0.5;
}

您可以使用Jquery插件来实现这一点。以下是您可以获取插件的链接

这是密码

$(document).ready(function() {
        $("input[type=password]").mobilePassword();

    });
HTML代码:

<input type="password" name = "password" id = "password" placeholder = "password" class ="input">


显示
$(“#showConfirmPassword”)。单击(函数(){
$('confirmPassword').attr('type','text');
setTimeout(function(){$('confirmPassword').attr('type','password');},500);
});
$('confirmPassword').attr('type','password');

我从“Garvit Mangal”那里得到了灵感,创建了一个JQuery插件

它有选项设置预览按钮和自定义字体图标预览图标以及一些增强功能

它可以与预览图标一起使用,如下所示

$(".pass").xpassword({preview : true, previewFontClass : 'iconview'});
$(".pass").xpassword();
并且没有预览图标

$(".pass").xpassword({preview : true, previewFontClass : 'iconview'});
$(".pass").xpassword();

我没有在谷歌上尝试过任何东西,但在谷歌搜索不到1分钟后没有找到解决方案:也许最好使用隐藏字段并显示文本的最后一个字符。你也可以使用这个插件,这是我迄今为止见过的最好的示例。我尝试过:并将你的javascript代码放在页面但没有变化:(而且我不想添加任何额外的脚本或库文件,只建议我使用简单的jquery或js代码,我可以在不包含任何
的情况下嵌入这些代码。我将您的javascript代码放在页面的顶部
:不。您不能放在那里,您必须将我的代码放在
$(文档)中。ready();
。查看我的编辑。它已经在document.ready中。我只需复制并粘贴您的代码到script标记中,并将该脚本放在页面的末尾。我不想添加任何其他脚本或库文件。只需建议我使用简单的jquery或js代码,我可以嵌入这些代码而不包含任何Hi@Garvit,此解决方案就有一个错误。如果您选择文本插入密码字段并写入一个新值,“隐藏”字段中的新字符会被追加(输入不会被清除)。修复应该很快:)@AlinaAnjum是否包含Jquery插件?@AlinaAnjum 1)从上述给定链接复制Javascript文件的内容。2)将其粘贴到一个文件中,并使用您想要的任何名称保存该文件。但请确保扩展名为“.js”。我已在下面包含完整的代码“”