Javascript 与Browser'；一起使用时，单选按钮上的eventListener（“更改”）不起作用；s后退按钮

我有两个同名的单选按钮，根据所选的一个，我想更改这些按钮下方的h1的内容。所有这些都封装在一个表单中，该表单提交给一个随机页面。问题是，在提交表单后，当用户使用浏览器的“后退”按钮返回表单页面时

最后选择的单选按钮已正确选择

但是h1的文本没有正确更新（而是显示默认的h1文本）

这是我的代码：

var option1=document.querySelector（“option1”）；
var option2=document.querySelector（“option2”）；
var标题=document.querySelector（“h1”）；
选项1.addEventListener（“更改”，（）=>{
heading.innerText=“选择选项一”；
});
选项2.addEventListener（“更改”，（）=>{
heading.innerText=“选择选项二”；
});

选择1
选择2
选择上述选项之一
提交表格
Update：每次通过历史记录/返回按钮访问页面时，都会重新加载该页面，暂时解决了该问题。此stackoverflow帖子帮助：。当页面从头开始加载时，不会选择任何选项，并显示默认的h1文本。