Question

我创建了一个很好的跨浏览器实用程序，可以确保表单“占位符”的行为方式相同（包括不实现它们的IE）

但是，当用户填写表单并且浏览器有助于为表单中的其余字段提供自动建议（例如，注册表单）时，这会产生不同的问题：您可以键入您的姓名和浏览器会自动提示您的姓氏，电子邮件地址，邮政地址等......

我不关心自动建议的值是什么，但我需要找到一种在每个字段上捕获“事件”的方法，这样我就可以隐藏我对占位符的实现。

我已经看过Chrome中的DOM元素，看看自动建议值是否存储在自定义属性中，但是不成功。

还有其他人见过或经历过这个吗？有谁知道它是否有可能捕获这样的事件？

注意：当用户接受自动建议时，此问题消失，这将成为自动完成，从而触发字段上的更改事件;所以我只需要捕捉建议事件

Answer 1

我制作了以下脚本，＆＃34;检测＆＃34;当字段由Webkit自动建议时：

我假设有人使用它知道Underscore和jQuery。

var $form = $('form'),
    autoCompleteSetting = $form.attr('autocomplete');

if (_.isUndefined(autoCompleteSetting) || autoCompleteSetting === "on") {
    _($form.find('input')).each(function($input){
        setInterval(function() {
            if ($input.is(":-webkit-autofill")) {
                // do your code here to detect the webkit autofill setting
            }
        }, 100);
    });  
}

我个人已将webkit-autofill检查放入三元运算符。

显然使用风险自负;每隔毫秒为页面上的每个字段运行这些间隔可能会给某些用户带来问题！

使用JavaScript捕获“自动建议”事件

1 个答案: