javascript 输入类型密码值？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11727686/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
input type password value?
提问by bonny
hello i have a problem with the following issue:
你好，我有以下问题：
i have two input fields. one is for the login username i.e. and the other one is the password. now i would like to set the value of both fields. my problem is the password. my intend to realize that is the following:
我有两个输入字段。一个是登录用户名 ie，另一个是密码。现在我想设置两个字段的值。我的问题是密码。我打算意识到以下几点：
HTML:
HTML：
<input
type="text"
id="log_password"
name="log_password"
value="<?php echo ($log_password);?>"
onfocus="if(this.value=='Password')this.value='';this.type='password'"
onblur="if(this.value=='') this.value=this.defaultValue;"/>
PHP:
PHP：
$log_password = "Password";
if(isset($_POST['submit'])){
$log_password = $_POST['log_password'];
if(empty($log_password)){
$errors['log_password'][]="No password given";
$_POST['log_password'] = "Password";
$log_password = $_POST['log_password'];
}
}
the problem is that this works up to the point where the form will be submitted. in case of an error the password is visible again because of the type="text"tag. so how can i solve this, if there is someone who could help me out i really would appreciate. thanks a lot.
问题是这在提交表单之前有效。如果出现错误，密码将再次可见，因为该type="text"标签。那么我该如何解决这个问题，如果有人可以帮助我，我将不胜感激。多谢。
UPDATE:
更新：
<div class="small2">
<?php if (!isset($errors['log_password'])):?>
<input
type="<?= $passwordVal == "" ? "text" : "password" ?>"
id="log_password" name="log_password"
value="<?php echo ($log_password);?>"
placeholder="Passwort"
onfocus="if(this.value=='Passwort')this.value=''"
onblur="if(this.value=='') this.value=this.defaultValue;"/>
<?php endif;?>
<?php if (isset($errors['log_password'])):?>
<input class="log-err"
type="<?= $passwordVal == "" ? "text" : "password" ?>"
id="log_password" name="log_password"
value="<?php echo ($log_password);?>"
placeholder="Passwort"
onfocus="if(this.value=='Passwort')this.value=''"
onblur="if(this.value=='') this.value=this.defaultValue;"/>
<?php endif;?>
</div>
回答by Matt
Use
利用
<input type="password" placeholder="Password" ... />
If you MUSTuse this as a text field (in order to display "Password") you should make the input type conditional:
如果您必须将其用作文本字段（以显示“密码”），您应该使输入类型有条件：
<?php
// in case of error, the value that the user entered will be passed back via GET (POST?)
$passwordVal = isset($_GET['log_password']) ? $_GET['log_password'] : "";
?>
<!-- if ($passwordVal) is an empty string, type is "text", else type is "password". -->
<input type="<?= $passwordVal == "" ? "text" : "password" ?>" ... />
回答by deste
As Matt correctly suggest, you can use placeholdertag.
正如马特正确建议的那样，您可以使用占位符标签。
But to get placeholder working, you cannot set "value". The solution is using conditional type, of course, or playing with jQuery framework. You can do something like this..
但是要让占位符工作，您不能设置“值”。解决方案当然是使用条件类型，或者使用 jQuery 框架。你可以做这样的事情..
<?
$your_pass = 'bla-bla-bla';
?>
<!DOCTYPE html>
<html>
<head>
<title>Test page</title>
<!-- Load jQuery library from Google repository -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
</head>
<body>
<form action="#">
<input type="password" name="log_password" id="log_password" />
</form>
</body>
<script>
$(document).ready(function() {
/* execute this by jQuery when document is ready */
/* must use traditional javascript to change input's type attribute */
document.getElementById('log_password').setAttribute('type', 'text');
/* set empty value attribute of input with id "log_password" */
$('input#log_password').attr('val','');
/* set placeholder attribute */
$('input#log_password').attr('placeholder','Password');
$('input#log_password').focus(function(){
/* when input with id log_password is focus.. */
$(this).attr('placeholder','');
/* set the value as you prefer... */
$(this).val('<?=$your_pass?>');
/* reset type of input to password */
document.getElementById('log_password').setAttribute('type', 'password');
});
});
</script>
</html>
回答by Dru
how about a script on document ready to check if log_password value is password and change the type.
准备好检查 log_password 值是否为密码并更改类型的文档上的脚本如何。
oh sorry dint see deste's post +1 for that
哦，抱歉，看到了 deste 的帖子 +1
回答by voodoo417
I think , you need change type from 'text' to 'password' , if has errors
我认为，如果有错误，您需要将类型从“文本”更改为“密码”
回答by voodoo417
write the code you regarded as a function and then call it with loading the page, focus event and blur event. The solution of Matt is nice but I think it restricted to HTML5 Supported browsers.
编写您视为函数的代码，然后通过加载页面、焦点事件和模糊事件调用它。Matt 的解决方案很好，但我认为它仅限于支持 HTML5 的浏览器。
