jquery - 如何从另一个页面链接标签内容

Question

在索引页面中，我可以看到当我单击选项卡二时，受尊重的内容将显示与单击类别页面标题选项卡二时相同，它必须打开索引页面并显示给受尊重的选项卡内容。

如果有人能说出我的解决方案，非常感谢。

索引页面
类别页面

Answer 1

你必须做一个简单的哈希码逻辑你可以在这里看到一个我之前创建的现场演示http://wbs.walkover.in/branding.php#custom 或者你可以试试这个代码

$(document).ready(function() {
   if(window.location.hash){changeProduct();}
   $(window).bind('hashchange',function(){changeProduct();});
});

function changeProduct(){
    var val = window.location.hash.substring(1)

    switch(val)
        {
        case 'custom':
            $('.accclk').removeClass('active');
            $("#cst").addClass('active')
            $('.dnon').hide();
            $("#custom").show();
        break;
        case 'online':
            $('.accclk').removeClass('active');
            $("#oln").addClass('active')
            $('.dnon').hide();
            $("#online").show();
        break;
        case 'product':
            $('.accclk').removeClass('active');
            $("#prd").addClass('active')
            $('.dnon').hide();
            $("#product").show();
        break;
        case 'solution':
            $('.accclk').removeClass('active');
            $("#sol").addClass('active')
            $('.dnon').hide();
            $("#solution").show();
        break;
        }

}

Answer 2

你有两个解决方案：

• 使其中一个页面成为另一个页面的子级，因为它可以从父级访问到子级，您可以通过window.open 示例来做到这一点：

如果你想$('#cat_id').html('text');在分类页面上访问，你可以从索引页面调用它window.opener.$('#cat_id').html('text2');。

• 制作共享 XML 文件并 setInterval让 JS 函数检查 XML 文件的任何更改

Answer 3

你必须建立一个像这里这样的哈希逻辑

然后你可以像 /category.html#tab3 这样链接

Answer 4

假设您想创建一个网站，点击导航中的按钮将动态加载一些内容。有点像有机标签的东西，只有内容是动态加载的。假设 HTML 是这样的：

<nav>
    <ul>
        <li><a href="index.php">Home</a></li>
        <li><a href="about.php">About</a></li>
        <li><a href="contact.php">Contact</a></li>
    </ul>
</nav>

jQuery JavaScript

JavaScript 是这里有趣的部分！这是简单的英语计划：

• 单击导航按钮时...
• 更改 URL 的哈希标记
• 当 URL 中的哈希标记更改时...
• 淡出旧内容
• 加载和淡入新内容
• 更新当前导航突出显示

那么，为什么要为“哈希标签”改变东西而烦恼呢？几个原因：

通过使用 Ben Alman 的hashchange 事件插件，我们可以启用浏览器的后退/前进按钮。超现代浏览器自己支持 hashchange 事件，这个插件可以支持旧浏览器。我们可以在页面加载时查找哈希并加载适当的页面（即“深度链接”）

先决条件

我们将使用 jQuery 库、onhashchange 插件，然后最后加载我们自己的脚本。

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js'></script>
<script type='text/javascript' src='js/jquery.ba-hashchange.min.js'></script>
<script type='text/javascript' src='js/dynamicpage.js'></script>

代码转储

$(function() {

    var newHash = "",
        $mainContent = $("#main-content"),
        $pageWrap = $("#page-wrap"),
        baseHeight = 0,
        $el;

    $pageWrap.height($pageWrap.height());
    baseHeight = $pageWrap.height() - $mainContent.height();

    $("nav").delegate("a", "click", function() {
        window.location.hash = $(this).attr("href");
        return false;
    });

    $(window).bind('hashchange', function() {

        newHash = window.location.hash.substring(1);

        if (newHash) {
            $mainContent.find("#guts").fadeOut(200, function() {
                $mainContent.hide().load(newHash + " #guts", function() {
                    $mainContent.fadeIn(200, function() {
                        $pageWrap.animate({
                            height: baseHeight + $mainContent.height() + "px"
                        });
                    });
                    $("nav a").removeClass("current");
                    $("nav a[href='" + newHash + "']").addClass("current");
                });
            });
        };

    });

    $(window).trigger('hashchange');

});​