AJAX는 주소

Question

I이 많은 페이지가 웹 사이트 : 예를 들어

:

홈페이지 : http://mywebsite.com/index.html

일부 페이지 : http://mywebsite.com/categorie/somepage.html

내가 결정을 페이지를 다시로드하지 않고도 AJAX로 동적으로 페이지를로드 할 수 있습니다. 내가 http://mywebsite.com/index.html(HOME) 클릭에 갈 경우, 플러그인을 설치 한 후,

<script type="text/javascript" src="uploads/scripts/jquery.address-1.2rc.min.js"></script> 
<script type="text/javascript"> 
       $('a').address(function() { 
        return $(this).attr('href').replace(/^#/, ''); 
       }); 
</script> 

자 : 그래서 딥 링크 백 앞으로 탐색 수 있도록하기 위해 jQuery를이 플러그인 (http://www.asual.com/jquery/address/docs/를) 주소 사용하기로 결정 일부 페이지 링크에서 페이지를 다시로드하지 않고도 jquery가 http://mywebsite.com/categorie/somepage.html을로드하면 브라우저의 주소 표시 줄에 http://mywebsite.com/index.html/#/categorie/somepage.html이 표시됩니다.

그러나, 문제입니다 :이 동적으로 생성 된 URL 복사 할 경우 : 웹 브라우저의 주소 표시 줄에 http://mywebsite.com/index.html/#/categorie/somepage.html 를, 그것이 아니라 "일부 페이지"페이지에 내 웹 사이트에 index.html을 페이지를 취할 것 . 또한 앞으로/뒤로 단추가 제대로 작동하지 않고 URL 막대의 주소 만 바꿉니다. 내용은 그대로 유지됩니다.

동적 URL을 올바른 페이지와 연결시키는 JavaScript 규칙을 작성해야한다고 생각합니까?

일부 도움을 주시면 감사하겠습니다. 감사합니다 :)이 같은

Answer 1

뭔가 :

$(function() { 
    var path = location.hash.substring(1); // remove '#' 
    if (path) { 
     $.address.value(path); 
    } 
}); 

업데이트 :

수동으로 페이지를로드하는 경우 (예 : 링크 클릭)에 대신의 주소를 이벤트 핸들러를 사용하여 (예를 들어 $.address.change(function() { ... })) 다음 path에서 페이지에 대한 Ajax 호출로 위의 $.address.value(path); 교체 :

$(function() { 
    var path = location.hash.substring(1); // remove '#' 
    if (path) { 
     // get page at path 
    } 
}); 

Answer 2

주소창에 복사 붙여 넣기 URL이 작동 중임 뒤로/다음 버튼도 작동합니다.

#는

사람이 작동하게 #을하는 방법을 알고이 있어야한다! Google에서 색인을 생성 할 수 있습니까?

또는 #/은 같은 것입니까?

기본적으로 워드 프레스에 나를 위해이 작품 :

// ajax setup 
$.ajaxSetup({cache:false, success: function() { 
// optional action here 
}}); 

// Event handlers 
$.address.init(function(event) { 
    $('#nav li a').address(function() { 
    return $(this).attr('href').replace(location.pathname, ''); 
    }); 
}).bind('externalChange', {}, function(event) { 
    var post_id; // get page id 
    var nav_id; // get nav class 
    // for back button 
    switch (true) { 
    case (event.value == undefined): 
      post_id = 2; nav_id = 'home'; break; 
    case (event.value == "/about"): 
      post_id = 19; nav_id = 'about'; break; 
    case (event.value == "/product"): 
      post_id = 26; nav_id = 'product'; break; 

    ...etc.... 

    default: post_id = 2; nav_id = 'home'; 
    } 

    // content loader on back/next button 
    $("#content-wrap").load("http://www.somesite.com/home/",{id:post_id}); // load content 
}); 

// content loader by #nav 
$(document).on("click","#nav li a",function(e){           
    var post_id = $(this).attr("id"); // get page id 
    $("#content-wrap").load("http://www.somesite.com/home/",{id:post_id}); // load content 
    return false; // keep url, no refresh 
}); 

Answer 3

당신은 Google의가 색인 할 수 있습니다 추가하여 (#!) : $ .address.crawlable (TRUE); 다음은 jQuery 주소 방법에 도움이되는 링크입니다. http://www.asual.com/jquery/address/docs/