javascript – Deselect checkboxes on back button click

Question:

How to reset checkboxes when returning to a page with them by pressing the browser's "Back" button?

There have been attempts to implement the code below, but it did not help:

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

How else can you set this condition?

Answer:

You can use the popstate event :

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

Alternatively, you can remove the "highlight" when the user leaves the page, to do this, replace the event with pagehide .

Scroll to Top