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

Question

在索引页面我能够看到当我点击标签两个尊重的内容将显示如此相同，当点击类别页面标题选项卡两个它必须打开索引页和向尊重的标签内容展示。

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

Index page
Category page

Answer 1

你拖的解决方案：

• 再拍由于的页面孩子之一，使其访问的形式 父到子，你可以通过window.open例如做：

如果您想在类别页面上访问$('#cat_id').html('text');，可以调用它从索引页window.opener.$('#cat_id').html('text2');。对于JS功能

• 设置共享XML文件，并setInterval去检查XML文件中的任何 变化

Answer 2

，你必须建立一个散列逻辑像here

，然后你可以像链接/ category.html＃tab3

Answer 3

假设您想创建一个网站，点击导航栏中的按钮可以动态加载一些内容。有点像有机标签的东西，只有内容是动态加载的。说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 event plugin，我们可以启用浏览器后退/前进按钮。超级现代浏览器自己支持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'); 

});​ 

Answer 4

你必须做出一个简单的哈希代码逻辑，你可以在这里看到一个现场演示，我已经创建了之前的某个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; 
     } 

}