密码输入字段长度 = 0 自动填充（android chrome）

Posted 2023-02-22

【中文标题】密码输入字段长度 = 0 自动填充（android chrome）

【英文标题】：Password input field length = 0 on autofill (android chrome)

【发布时间】：2014-12-11 10:31:06

【问题描述】：

我正在登录页面上的输入字段上运行占位符。在 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");
    
   

【问题讨论】：

如果您将代码添加到这篇文章中，您会得到更快的结果。

【参考方案1】：

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

所以，我通过在密码字段上添加 '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'));
);

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

【讨论】：

同样的问题，但仍然没有解决方案