返回后未取消选中复选框

Checkbox not getting uncheck after going back

本文关键字:复选框 取消 返回      更新时间:2023-09-26

我有一个代码,其中我使用了一些复选框,点击它们时,我会在url中添加带有哈希的复选框值,但当我返回或按下后退按钮时,url会发生更改,但复选框仍处于选中状态。请按照以下检查代码

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
$checkboxes = $('input[type=checkbox]');
$checkboxes.change(function(){
    window.location.hash = 'check=' + $checkboxes.filter(':checked').map(function(){
        return this.value;   
    }).get().join(",");
    //console.log(window.location.hash);
}); });</script>
<input type="checkbox" name="check" value="one">one<br>
<input type="checkbox" name="check" value="two">two<br>
<input type="checkbox" name="check" value="one">three<br>
<input type="checkbox" name="check" value="two">four<br><input type="checkbox" name="check" value="one">five<br>
<input type="checkbox" name="check" value="two">six<br><input type="checkbox" name="check" value="one">seven<br>
<input type="checkbox" name="check" value="two">eight<br>
</body>
</html>

现在,当我在选中一些复选框后单击返回时,url会发生更改。但复选框仍然处于选中状态。一旦我选中了一些复选框,我如何在返回后取消复选框复选框。。。

这里可以使用javascript/jQuery的hashchange函数。

window.onhashchange = function () {//add you logic here to check difference in url alert(window.location.hash);};

或者您可以使用jQuery的hashchange函数。

$(window).on('hashchange', function() {
     alert(window.location.hash);
});

您可以使用上面的任何一个函数来对hashURL进行操作。