Question

如果点击<div id = button1/2/3>，我有Javascript功能来显示内容。但刷新页面后，所有内容都被隐藏了。我想记住最后一个动作 - 缓存它。

请帮助。

        $(document).ready(function() {
          $("#button1, #button2, #button3").hide();

          $("#news1").click(function() {
          $("#button1").show(); 
          $("#button2, #button3").hide();
          });

          $("#news2").click(function() {
          $("#button2").show(); 
          $("#button1, #button3").hide();
          });

          $("#news3").click(function() {
          $("#button3").show(); 
          $("#button1, #button2").hide();
          });
       });

Answer 1

您可以使用locastorage。 localstorage将在http调用之间保持不变。所以你将能够轻松地坚持国家。我还更新了您的代码，以便遵循最佳做法。

这是HTML：

<input id="button1" type="button" class="expand" value="b1">
<input id="button2" type="button" class="expand" value="b2">
<input id="button3" type="button" class="expand" value="b3">


<input class="news" type="button" data-id="1" value="n1">
<input class="news" type="button" data-id="2" value="n2">
<input class="news" type="button" data-id="3" value="n3">

这是javascript。请注意我在大多数情况下使用classes：

    (function () {

        function resetLocalStorage() {
            $('.expand').each(function () {
                delete localStorage[$(this).attr('id')];
            });
        }

        $(".expand").each(function () {
            if (localStorage.hasOwnProperty($(this).attr('id'))) $(this).show();
            else if (localStorage.hasOwnProperty('trackingIsOn')) $(this).hide();
        });

        $(".news").click(function () {
            $('.expand').hide();
            var buttonElem = $('#button' + $(this).data('id'));
            buttonElem.show();
            resetLocalStorage();
            localStorage[buttonElem.attr('id')] = true;
            localStorage.trackingIsOn = true;
        });

    })();

您可以找到完整的工作示例here

持续状态的动态扩展按钮

1 个答案: