Определение момента заполнения автозаполнения

Обнаружена ошибка на странице http://code.google.com/p/chromium/issues/detail?id=46543#c22, в связи с этим, похоже, что в конечном итоге может (должно) стать возможным просто перезаписать стиль по умолчанию с помощью селектора !important, который будет самое элегантное решение. Код будет примерно таким:

input {
    background-color: #FFF !important;
}

На данный момент, хотя ошибка все еще открыта, и похоже, что ваше хакерское решение является единственным решением для Chrome, однако а) решение для Chrome не требует setTimeout и б) похоже, что Firefox может уважать флаг !important или какой-то селектор CSS с высоким приоритетом, как описано в Переопределить заполнение форм и выделение ввода в браузере с помощью HTML / CSS. Это помогает?

Если вы используете Chrome или Safari, вы можете использовать селектор input:-webkit-autofill CSS для получения автозаполненных полей.

Пример кода обнаружения:

setInterval(function() {
    var autofilled = document.querySelectorAll('input:-webkit-autofill');
    // do something with the elements...
}, 500);

Я предлагаю вам в первую очередь избегать автозаполнения, а не пытаться обмануть браузер

<form autocomplete="off">

Дополнительная информация: http://www.whatwg.org/specs/web-forms/current-work/#the-autocomplete

Если вы хотите сохранить режим автозаполнения, но изменить стиль, возможно, вы можете сделать что-то вроде этого (jQuery):

$(document).ready(function() { 
  $("input[type='text']").css('background-color', 'white');
});

$(window).load(function()
{
    if ($('input:-webkit-autofill'))
    {
        $('input:-webkit-autofill').each(function()
        {
            $(this).replaceWith($(this).clone(true,true));
        });
        // RE-INITIALIZE VARIABLES HERE IF YOU SET JQUERY OBJECT'S TO VAR FOR FASTER PROCESSING
    }
});

Я заметил, что опубликованное вами решение jQuery не копирует вложенные события. Опубликованный мной метод работает для jQuery 1.5+ и должен быть предпочтительным решением, поскольку он сохраняет присоединенные события для каждого объекта. Если у вас есть решение для перебора всех инициализированных переменных и их повторной инициализации, тогда будет доступно полное 100% рабочее решение jQuery, в противном случае вам придется повторно инициализировать установленные переменные по мере необходимости.

например, вы делаете: var foo = $ ('# foo');

тогда вам нужно будет позвонить: foo = $ ('# foo');

потому что исходный элемент был удален, и теперь на его месте существует клон.