Question

我正在使用Jquery在第1页上切换隐藏（默认情况下）div。

$(document).ready(function(){
    $(".trigger").click(function(){
        $(".panel").toggle("fast");
        $(this).toggleClass("active");
        return false;
    });
});

我需要做的是链接到第2页的第1页，以及在同一事件中打开隐藏的div。

我希望有人可以对这个简单的执行有所了解吗？干杯！

Answer 1

第2页

：

<a href="page1.html?panel_open=1"> click me </a>

第1页

：

$(document).ready(function() {
    // parse the query params
    var url_params = (window.location.search.substr(1)
      .split('&')
      .reduce(function(prev, curr) { 
          curr = curr.split('='); 
          if( curr.length > 1 ) { prev[curr.shift()]=curr.join('='); }
          return prev; 
      }, {}));

    if( url_params.panel_open ) {
        // if "panel_open" was passed in the URL, then open the panel
        $(".panel").toggle("fast");
    }
});

编辑：在上面的查询字符串解析代码中做了一些小改动，以提高一些边缘情况下的稳健性。

<强>更新

较旧的浏览器（包括IE8）不支持reduce()功能。所以，这是上面代码的一个版本，不使用该函数：

$(document).ready(function() {
    var parts = window.location.search.substr(1).split('&');
    var url_params = {};
    for (; parts.length ;) {
        var curr = parts.shift().split('=');
        if (curr.length > 1) {
            url_params[curr.shift()] = curr.join('=');
        }
    }

    if( url_params.panel_open ) {
        // if "panel_open" was passed in the URL, then open the panel
        $(".panel").toggle("fast");
    }
});

Answer 2

由于事件不会跨页面持续存在，我建议使用其他策略，例如在查询字符串中传递参数或哈希链接，接收页面可以解释并打开相关div。

链接到页面并触发div上的切换事件

2 个答案: