Html/JS 在模糊/焦点后在输入中显示密码答案

【问题标题】：Html/JS show password in input after Blur/FocusHtml/JS 在模糊/焦点后在输入中显示密码
【发布时间】：2015-10-26 22:17:57
【问题描述】：

我有一个包含密码字段的简单表单：

<input required type="password" value="Insert password" style="color:#888;" onfocus="inputFocus(this)"  onblur="inputBlur(this)">

JS函数是（点击清除并改变颜色后..）：

function inputFocus(input) {
    if (input.value === input.defaultValue) {
        input.value = "";
        input.style.color = "#000";
    }
}
function inputBlur(input) {
    if (input.value === "") {
        input.value = input.defaultValue;
        input.style.color = "#888";
    }
}

如果我加载页面，我想在输入字段中查看标准值。对于type="text" 类型，这不是问题，但对于type="password"，我只看到点。我想查看默认值（插入密码），但是当用户开始输入密码时，他必须看到点。

怎么样？

感谢您的回复。

【问题讨论】：

你知道浏览器内置了这个吗？占位符属性。
如果你想向用户显示他们输入的密码，你可以使用 attr("type", "text");或 attr("type", "password");但是对于占位符，您应该使用上述建议

标签： javascript html input

【解决方案1】：

使用占位符属性：

   &lt;input required type="password" placeholder="Insert password" /&gt;

【讨论】：

【解决方案2】：

HTML5 占位符怎么样？你不需要 JavaScript：

<input required type="password" placeholder="Insert password" style="color:#888;">

【讨论】：

【解决方案3】：

答案很简单——不要使用value 属性作为“插入密码”，而是使用placeholder。

<input type="password" placeholder="insert password">

http://jsfiddle.net/763bjejn/

【讨论】：