javascript - 单击链接打开页面后显示页面中隐藏的div

Question

我有一个 HTML 页面，其中隐藏的 div 在单击按钮时变为可见。像这样:

$('#display').click(function(){
    $('#itemList').removeClass('hide');
    ...
})

在另一个页面上，有一个链接，单击该链接会将用户带回到之前的页面，并且该页面上具有 id='itemList' 的元素必须变为可见。代码是这样的:

<a href='firstHTML.php'> View items</a>

我不确定要在代码中添加什么才能使另一个页面显示之前隐藏的元素可见。有人可以帮忙吗？

Answer 1

最可能的解决方案之一是 localStorage。您还可以实现 Cookie 或字符串查询以将值传递给其他页面。

我正在展示 localstorage 的使用，您可以在点击 anchor 时将 id 存储在 localStorage 中，如下所示

<a href='firstHTML.php' data-showId='itemList'> View items</a>

现在在 anchor 上绑定(bind)事件

$("[data-showId]").bind('click',function(){
    var idToShow=$(this).attr('data-showId');
    if(idToShow)
      store('visibleId', idToShow);
});

现在您需要定义这些函数。

   function setup() {
        var tmp = get('visibleId');
        if (tmp)
          showDiv(tmp);
    } 
    function showDiv(cls) {
        $("#"+cls).removeClass('hide');
    }
    function get(name) {
        if (typeof (Storage) !== "undefined") {
          return localStorage.getItem(name);
        } else {
          window.alert('Please use a modern browser to properly view this template!');
        }
    }
    function store(name, val) {
        if (typeof (Storage) !== "undefined") {
          localStorage.setItem(name, val);
        } else {
          window.alert('Please use a modern browser to properly view this template!');
        }
    }

现在调用 setup() 准备好 dom..