В Chrome после отправки формы и возврата ее значения автоматически заполняются после DOMContentLoaded. Можно ли прислушаться к этому изменению?

Question

См. Пример здесь: https://large-platinum-ethernet.glitch.me.

Использование Google Chrome (с использованием v81 с мая 2020 г.):

1. Откройте консоль .
2. Выберите значение, отличное от «Option 0».
3. Нажмите «Отправить».
4. Нажмите «Назад» в браузере.
5. Значение элемента select будет обновлено до значения select при отправке формы. Однако, если вы проверите консоль, вы увидите, что изначально значение равно «Option 0», и оно обновляется до значения до перехода через некоторое время между DOMContentLoaded и window.onload.

Кто-нибудь знает, можно ли услышать, когда Chrome внесет это изменение? Событие change или input не запускается. Я пробовал использовать setTimeout внутри обработчика DOMContentLoaded, и это, похоже, работает, но кажется хакерским и потенциально непоследовательным.

Изменить: похоже, короткий ответ - «нет, нет» t событие, которое запускается, когда Chrome изменяет значения ». Вместо этого можно увидеть, была ли страница загружена после события навигации. Если это так, любые значения формы, установленные с помощью window.onload, могут считаться установленными браузером.

Answer 1

Похоже, в Pageshow есть ошибки.

performance.getEntriesByType("navigation")[0].type === 'back_forward

(устаревшее значение) window.performance.navigation.type === 2

Вы также можете использовать autocomplete=off во входных данных формы

EDIT: pageshow doesn ' По состоянию на 5/6/2020 Chrome 81
pageshow / pagehide события работают для обнаружения загрузки из bfcache, откуда загружаются значения формы.

https://github.com/adobe/webkit/blob/master/Websites/webkit.org/blog-files/pageshow-pagehide-example.html https://developers.google.com/web/updates/2018/07/page-lifecycle-api https://developer.mozilla.org/en-US/docs/Web/API/Window/pageshow_event

function pageShown(evt)
{
    if (evt.persisted)
        ; // do things to your forms
    else
        ; // no need to do anything
}

function pageHidden(evt)
{
    if (evt.persisted)
        ; // do things to your forms
    else
        ; // no need to do anything
}

window.addEventListener("pageshow", pageShown, false);
window.addEventListener("pagehide", pageHidden, false);