Снять выделение чекбоксов при нажатии кнопки назад

Question

Как сделать обнуление чекбоксов при возвращении на страницу с ними, путем нажатия браузерной кнопки "Назад"?

Были попытки внедрения кода ниже, но это не помогло:

document.addEventListener('DOMContentLoaded', () =>{
  [...document.getElementsByClassName('form-check-input')].forEach(item =>{
    item.checked = false
  })
})

Как еще можно задать данное условие?

Answer 1

Вы можете воспользоваться эвентом popstate:

window.addEventListener("popstate", event => {
   const inputs = document.querySelectorAll(".form-check-input")
   if (inputs) {
      inputs.forEach(input => { 
         input.setAttribute("checked", false) 
      })
   }
}, false)

Как альтернатива, можно снимать "выделения" в тот момент когда пользователь уходит со страницы, для этого замените эвент на pagehide.

UPDATE:

Пользователю @QuickBrownFox помогло дополнительное добавление атрибута autocomplete со значением off для тега(ов) input:

<input autocomplete="off" />

БЛОГ НА HUSL

Снять выделение чекбоксов при нажатии кнопки назад

Ответы (1 шт):