链接到页面并触发div上的切换事件 [英] Link to a page and trigger toggle event on div

问题描述

我正在使用Jquery切换第1页上的隐藏(默认情况下)div.

I am using Jquery to toggle a hidden (by default) div on page 1.

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

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

What I need to be able to do is link to page 1 from page 2 as well as open the hidden div in the same event.

我希望有人可以阐明这一点的简单执行?干杯！

I'm hoping someone can shed some light on a simple execution of this? Cheers!

推荐答案

第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");
    }
});

对上面的查询字符串解析代码进行了一些小的更改，以提高在少数情况下的鲁棒性.

made a couple of minor changes in the query string parsing code above, to improve robustness in a few edge cases.

更新

较旧的浏览器(包括IE8)不支持 reduce() 函数.因此，这是上面的代码的一个不使用该功能的版本:

Older browsers (including IE8) don't support the reduce() function. So, here's a version of the code above that doesn't use that function:

$(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");
    }
});

这篇关于链接到页面并触发div上的切换事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！