0

所以我搜索了一段时间，我想我找到了答案，但我不确定如何应用它。

我的问题是：我有一个有菜单的网站（该网站用 PHP 和 HTML5 编码），每个菜单项都链接到另一个页面。页面的工作方式是：

http://domainhere/index.php#home
http://domainhere/index.php#about
http://domainhere/index.php#contact

等等……

到目前为止，该网页并不理想，因为如果用户想直接链接到 about 页面，index.php#home 页面将被加载。我想要的是一个功能，当文档加载地址时，它可以读取主题标签后的值并在我编写的#content div容器中加载适当的内容。到目前为止，我有使用动画和 show()/hide() 的 jQuery 函数来隐藏每个页面的 div。另外，我的主页与其他页面的格式不同，它需要一个动画来减小页眉的大小。我已经阅读了这个并且很多解决方案都提出了 AJAX，但我不确定如何应用它。任何对首发的提醒都会很棒，我会继续努力！

谢谢

4

2 回答 2

0

我使用 jQuery 读取主题标签并对其进行响应的解决方案如下。

我使用的 jQuery 插件：jquery.ba-hashchange.min.js，位于：http ://benalman.com/projects/jquery-hashchange-plugin/

我将哈希更改功能设置为在页面加载和哈希更改时发生。因此，不是从菜单单击调用您的显示/隐藏函数，您只需将它们放在哈希更改函数中并让它处理页面加载和菜单选择。然后，您的菜单链接只需要关心更改哈希即可。

而且，如果您最终切换到使用 AJAX 单独加载页面内容，而不是一举加载整个站点，那么切换中的函数调用可以使 ajax 调用返回特定内容。或者，您可以将主题标签传递给通用 ajax 调用，ajax Web 方法/服务调用可以根据传递的主题标签确定要返回的内容。

$(function () {
    $(window).hashchange(function () {
        var hash = location.hash;

        //This part here untested - you'll need to write it custom for your menu.
        switch (hash){
          case "#about":
              ShowAboutDiv(); 
              //this should be the function you already call to show the about div.
              break;
          case "#contact":
              ShowContactDiv();
              break;
          default :
              //show home div, or maybe it already shows.
              break;
        };
    });


    //handle page load hash...
    $(window).hashchange();
});
于 2012-05-31T16:39:07.100 回答
0

如果我的问题是正确的，你可以做这样的事情，

$(document).ready(function(){
   var target = location.hash;

   // Code to hide all section

   // Show the section/div whose is placed on url
   $(target).show('fast');

});
于 2012-05-31T16:30:54.493 回答