0

我有 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;
    });
});
4

2 回答 2

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; }
于 2012-11-17T09:20:50.693 回答
0

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

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

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

于 2012-11-17T08:38:50.517 回答