jQuery锚导航

Question

我想用jQuery构建一个基本的基于锚的导航系统。我真的不想用像这样的插件作为建议在这里。有人能帮我解决建立这样一个系统的基本逻辑吗？

本质上，我希望能够有一个页面通过以下链接提供多个ajax内容：

• /myurl.html#state1
• /myurl.html#state2

目前，我只是绑定到链接的点击处理程序，打开对话框等。然后，我可以将网址更改为/myurl.html#state1。问题是，我是这样做的，还是让<a>标记本身指向那个url，然后使用jQuery来检测URL是否已经改变，这意味着它也可以在页面加载上工作？

任何建议/想法都会很好-谢谢

Answer 1

<a href="#state1" rel="ajaxpage1.html"></a>
<a href="#state2" rel="ajaxpage2.html"></a>

$('a').each(function (i,obj){
   $(obj).click(function (){
       var url = $(obj).attr('rel');
       $..ajax({
          url: url,
          success: function (){...},
          error : function (){...}// incase you get a 404, or 500 and so on....
       });
   });
});

$(document).ready(function (){
   //if you need it on refresh, or if a user got the link from another page
   // it automatically will trigger the click therefore trigger the ajax
   if(window.location.hash != '#'){
      $('a[href="'+window.location.hash+'"]').click();
   }
});

我仍然认为你应该使用一个插件，因为它们有but，并且可能会修复它们，这样你就不得不测试你的插件，浪费大量的时间，但你的调用:)