Question

我使用了占位符来输入密码字段。密码字段的输入类型是“文本”，当我输入密码时，它无法正常工作。

当我输入我的密码时，我的第一个密码字符输入不正确就像按键第一次没有工作。

请点击以下链接

http://www.techmodi.com/demo/firstjitters/

点击登录按钮，打开一个弹出窗口，我在其中使用了占位符密码字段。

代码：

 <input name="password" id="password" type="text" class="input" tabindex="2" placeholder="Password" />

js file：

window.onload = function() {
    var arrInputs = document.getElementsByTagName("input");
    for (var i = 0; i < arrInputs.length; i++) {
        var curInput = arrInputs[i];
        if (!curInput.type || curInput.type == "" || curInput.type == "text" || curInput.type == "password")
            HandlePlaceholder(curInput);
    }
};

function HandlePlaceholder(oTextbox) {
    //alert(typeof oTextbox.placeholder);
    if (typeof oTextbox.placeholder == 'string') {
        var curPlaceholder = oTextbox.getAttribute("placeholder");
        if (curPlaceholder && curPlaceholder.length > 0) {
            oTextbox.value = curPlaceholder;
            oTextbox.setAttribute("old_color", oTextbox.style.color);
            oTextbox.style.color = "#c0c0c0";
            oTextbox.onfocus = function() {
                this.style.color = this.getAttribute("old_color");
                if (this.value === curPlaceholder)
                    this.value = "";
            };
            oTextbox.onblur = function() {
                if (this.value === "") {
                    this.style.color = "#c0c0c0";
                    this.value = curPlaceholder;
                }
            };
        }
    }
}

Answer 1

您发布的代码适用于不支持placeholder属性且与您的问题无关的旧版浏览器。

您的问题是您从文本字段开始，然后在用户开始输入时将其转换为密码字段我猜测使用onkeyup或onchange之类的内容，更改onfocus的触发器应该可以解决您的问题。

占位符不适用于密码字段

1 个答案: