2011-04-08 2 views
0

jQuery를 사용하여 기본 앵커 기반 탐색 시스템을 만들고 싶습니다. 나는 plugin like thissuggested here으로 사용하고 싶지 않습니다. 이런 식으로 시스템을 구축하는 기본적인 논리로 누군가가 나를 도울 수 있습니까?jQuery 앵커 탐색

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

가 현재 나는 단지의 클릭 핸들러에 바인딩 :

는 기본적으로 나는 한 페이지는이 같은 링크를 통해 여러 아약스의 컨텐츠를 제공하도록 할 수 있도록하려면 대화 상자를 여는 링크 등. 그러면 URL을 /myurl.html#state1으로 변경할 수 있습니다. 질문은 내가 이런 방식으로합니까, 아니면 그냥 URL을 가리키는 <a> 태그 자체를 만든 다음 jQuery를 사용하여 URL이 페이지로드시에도 작동한다는 의미가 변경된 것을 감지 할 수 있습니까?

어떤 제안이/생각이 좋은 것 - 그들이 버그를했다대로 난 아직도 것은 당신이 플러그인을 사용한다

+4

당신이 플러그인을 사용하고 싶지는 않을 수도 있지만 jquery-bbq가 이러한 종류의 기능에 가장 적합한 것으로 나타났습니다. http://benalman.com/projects/jquery- bbq-plugin/ – Calum

+0

Sans 플러그인이 사용 가능합니다. http://yensdesign.com/2008/11/creating-ajax-websites-based-on-anchor-navigation/ – Calum

+0

@Calum 나는 전에 BBQ를 발견했습니다. 제안을위한 anks, 한 페이지에 대한하지만 플러그인 너무 잔인한 것 같습니다. 전에도 yendesign 포스트를 보았습니다. 그러나 변경을 확인하기 위해 타이머를 설정하는 아이디어가 정말 마음에 들지 않았습니다 .- 쓸데없는 것 같습니다. – Chris

답변

2
<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(); 
    } 
}); 

감사하고, 그래서 당신은 당신의 것, 폐기물을 많이 테스트하는 것 아마 그들을 고정 시간 그러나 전화하지만 :)