Jquery在另一个页面中显示/隐藏答案

【问题标题】：Jquery show/hide in another pageJquery在另一个页面中显示/隐藏
【发布时间】：2012-11-17 17:20:50
【问题描述】：

我有 2 个 html 页面

第 1 页有 2 个链接“link1”和“link2”

在第2页还有2个链接“link1”和“link2”以及2个<div id="pan1">和<div id="pan2"><div id="pan1">

&<div id="pan2"> 与 jquery 一起显示/隐藏

我希望当用户单击 page1 中的 link1 时，它将转到第 2 页并显示 div"id=pan1"，当用户单击 page1 中的 link2 时，它将转到第 2 页和 div"id=pan2"会显示。

这是第 1 页的 html 代码

<ul class="linkList">
<li><a href="#pan1">Link 1</a></li>
<li><a href="#pan2">Link 2</a></li>
</ul>

这是第 2 页的代码

html

<ul class="linkList">
<li><a href="#pan1">Link 1</a></li>
<li><a href="#pan2">2</a></li>
</ul>
<div id="pan1" class="switchgroup" style="padding:10px; background-color:#060">div 1</div>
<div id="pan2" class="switchgroup" style="padding:10px; background-color:#936">div 2</div>

css

#pan1, #pan2{
    display:none;   
}

jquery

$(document).ready(function(){
    $('#pan1').show();
    $('.linkList li:first-child a').addClass('active');
    $('.linkList li a').click(function() {
        var tabDivId = this.hash;                              

        $('.linkList li a').removeClass('active');
        $(this).addClass('active');
        //console.log(tabDivId);
        $('.switchgroup').hide();
        $(tabDivId).fadeIn();
        return false;
    });
});

【问题讨论】：

你是否有机会使用 .net 或 php？
对不起，我没有更多的时间，这就是我将其作为评论发布的原因，但您可以查看此 jquery 插件，github.com/AlexChittock/JQuery-Session-Plugin 您可以使用会话来执行您所要求的操作。希望这对您有所帮助。

标签： jquery html css show-hide

【解决方案1】：

这应该让您大致了解如何执行此操作。请注意，我尚未测试此代码，因此可能存在一些小问题。

第 1 页 HTML：

<ul class="linkList">
    <li><a href="page2.html#pan1">Link 1</a></li>
    <li><a href="page2.html#pan2">Link 2</a></li>
</ul>

第 2 页 HTML：

<ul class="linkList">
    <li><a href="#pan1" class="panlink">Link 1</a></li>
    <li><a href="#pan2" class="panlink">2</a></li>
</ul>
<div id="pan1" class="switchgroup">div 1</div>
<div id="pan2" class="switchgroup">div 2</div>

第 2 页 JS：

$(function() {
    var anc = window.location.href.split('#')[1];
    $('#' + anc + '.switchgroup').show();

    $('a.panlink').click(function() {
        $('.switchgroup').hide();
        $($(this).attr('href')).show();
    });
});

第 2 页 CSS：

.switchgroup { display: none; }

【讨论】：

是的，它工作正常......但我希望当用户直接转到 page2 时，div 1 将首先显示
@SonasishRoy 你能详细说明一下吗？
我希望当用户直接登陆 page2 时，div1 将默认显示。

【解决方案2】：

我认为您不能创建要在其他页面上实现的功能，但在您的情况下，您可以使用参数：

当您提供第二页的（重定向到第二页）时添加查询字符串参数，或通过表单的参数（Post/Get）。并在 JQuery 的就绪函数上添加您的隐藏/显示代码。

从我理解你的问题的地方，这应该可以工作。

【讨论】：