javascript - 如何关闭或重新加载后显示相同的内容

Question

您好，我编写了一个代码，该代码将本地存储应用于页面上的选项。我遇到的唯一问题是我无法保存选项搜索的页面。正如你在 js fiddle 中看到的那样。即使在刷新后，这些选项仍与选择时保持相同。但是当你点击搜索功能时。它会将您带到应用了这些选项的图像。但当你刷新页面时，它又回到原来的状态。刷新后如何保持相同的显示

这是我的本地存储代码，它适用于选项，但不适用于显示搜索生成的内容。

    $('#browsepagebutton').on('click', function() {

  $('select').each(function() {
    var id = $(this).attr('name');
    var value = $(this).find("option:selected").val();
    console.log("SetItem : " + id + " with value : " + value)
    localStorage.setItem(id, value);

  });
});

$(document).ready(function() {
  $('select').each(function() {
    var id = $(this).attr('name');
    if (localStorage.getItem(id) !== null) {
    var value = localStorage.getItem(id);
    $(this).val(value)
    }

  });
})

Js 代码 fiddle https://jsfiddle.net/387tnzoy/4/ (注意该功能不起作用)js fiddle 确实显示了代码，以便您可以了解正在发生的情况。当我在 pi 的生命周期上应用动画等过滤器并单击提交按钮时，它只会在选项下方显示 pi 图像的生命周期，因为它是唯一设置该选项的图像。现在唯一的问题是我想要本地存储来保存该页面。这样当我刷新时它仍然在该显示屏上。

Answer 1

$('select option').each(function() {
    var id = $(this).attr('name');
    if (localStorage.getItem(id) != null && id=='name') {
        $(this).attr("selected", "selected");
    }

  });