如何保存選擇的 Jquery 在同一頁面上選擇的選項，即使在刷新頁面后停留在同一位置a

Question

 <html> <head> <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> <script src="http://code.jquery.com/jquery-1.8.3.js"></script> <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.jquery.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.css"> </head> <body> <form method="POST" name="" action=""> <select class="chzn-select" multiple="true" name="time" style="width:300px;" id="rememberSelected"> <option value="00:30">00:30</option> <option value="01:00">01:00</option> <option value="02:00">02:00</option> <option value="02:30">02:30</option> <option value="03:00">03:00</option> <option value="30:30">03:00</option> <option value="04:30">04:30</option> <option value="05:00">04:30</option> </select> <button type="button">Save</button> </form> <script type="text/javascript"> $(function() { $(".chzn-select").chosen(); }); </script> <script> $("#rememberSelected").val(localStorage.getItem("selected") || 1); $("#rememberSelected").on("change", function() { localStorage.setItem("selected", $(this).val()); }); </script> </body> </html>

如何在使用所選 jquery 單擊保存按鈕后將所選選項保存在同一位置，即使我刷新頁面，所選選項也應保持在同一位置。

Answer 1

將選定的選項存儲到 localStorage 並在頁面加載時檢索它。

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

if(!!localStorage.getItem("selected")) {
    $("#rememberSelected").val(localStorage.getItem("selected").split(",")).trigger("chosen:updated");
}

$("button").on("click", function() {
    localStorage.setItem("selected", $("#rememberSelected").val());
});

Answer 2

您可以將 state 保存到localStorage

<script>
if (localStorage['select-state']) {
    $( "select" ).val(JSON.parse(localStorage['select-state']));
}

$( "select" ).change(function() {
    localStorage['select-state'] = JSON.stringify($(this).val());
});
</script>

如何保存選擇的 Jquery 在同一頁面上選擇的選項，即使在刷新頁面后停留在同一位置a

問題描述

2 個解決方案

解決方案1
0 已采納 2020-07-09 07:17:47

解決方案2
0 2020-07-09 07:26:06

如何保存選擇的 Jquery 在同一頁面上選擇的選項，即使在刷新頁面后停留在同一位置a

問題描述

2 個解決方案

解決方案1 0 已采納 2020-07-09 07:17:47

解決方案2 0 2020-07-09 07:26:06

解決方案1
0 已采納 2020-07-09 07:17:47

解決方案2
0 2020-07-09 07:26:06