自动填充时密码输入字段长度= 0(android chrome)

Question

我在登录页面上的输入字段上运行占位符.在android(4.3)上,它会在页面加载时自动填充用户和密码字段.使用Javascript我能够获得自动填充用户输入的长度,但是当我在密码输入上运行相同的函数时,它返回0.

即使我使用Chrome远程调试进行调试,它也会显示密码输入字段为"",长度为0.但是,android chrome会在字段中显示密码.

有没有办法解决.我只需要在输入字段不为空时进行检测,这样我就可以隐藏占位符了.

$(document).ready(function(){
    setTimeout(function () {
        alert($("#password").val().length);
        checkPlaceholder("#password");
    }, 1000);
});

function checkPlaceholder(x) {
    if($(x).val().length === 0){
        $(x).parent().find(".input_placeholder").removeClass("placeholder_hide");
    }
    else {
        $(x).parent().find(".input_placeholder").addClass("placeholder_hide");
    }
}   

Answer 1

嗯，我也有类似的问题。而且我没有找到任何关于这方面的信息。但我注意到，Android Chrome 在用户点击文档正文后会用实际值填充密码字段。在该密码字段生成'change'事件之后，如果您检查它的值，它将被填充。不幸的是，如果我们触发事件，Chrome 不会以同样的方式工作'click'/'touch'/'focus' etc.，只有硬件点击。

因此，我通过在密码字段上添加事件侦听器解决了我的问题'change'。对于你来说，解决方案可以是这样的：

$(document).ready(function() {
    // leave this code for other browsers
    setTimeout(function () {
        alert($("#password").val().length);
        checkPlaceholder("#password");
    }, 1000);
    // android Chrome fix
    $('#password').change(checkPlaceholder.bind(null, '#password'));
});

但是，正如我之前所写，该代码仅在用户点击页面后才会执行。