문제가 발생했습니다. 작성중인 사이트에 대해 History.js를 구현하십시오.

Question

나는 몇 가지 문제점에 대한 가능한 해결책으로 history.js를 발견했습니다. 내가 만들고있는 웹 사이트의 경우 내 콘텐츠를로드 할 정적 페이지를 만들기로했습니다. 그래서 나는 3 Divs (머리글, 하나 menubar 및 콘텐츠에 대한) 메뉴에서 링크를 클릭하면 그 페이지는 콘텐츠 div에로드됩니다. 이 때문에 모든 트래픽이 index.php 페이지에 유지되므로 뒤로 버튼을 클릭하면 마지막으로 방문한 콘텐츠로 이동하지만 마지막으로 방문한 페이지로 이동합니다. 그것의 나의 이해는 history.js로 이것을 해결할 수 있습니다.

그래서 내 페이지에는 메뉴 모음에 onclick 함수가 호출되는 여러 링크가 있습니다. 예 :

<li><a href="javascript:void(0);" onclick="myprofile()" ><span>my profile</span></a></li> 
    <li><a href="javascript:void(0);" onclick="mysettings()"><span>Settings<small> 

함수는 다음과 같습니다.

function myprofile() { 
$('#content').load('members.php'); 
} 
function mysettings() { 
$('#content').load('settings.php'); 
} 

는 좀 (이 포럼에 있음) history.js에 대한 자바 스크립트 그리고 내 index.php를 내부의 URL을 변경 않지만 다시 클릭하면 그 페이지를로드 나던 있지만 추가. 함수를 사용할 때 history.js를 어떻게 작동시킬 수 있습니까?

<script> 
        $(function() { 

    // Prepare 
    var History = window.History; // Note: We are using a capital H instead of a lower h 
    if (!History.enabled) { 
     // History.js is disabled for this browser. 
     // This is because we can optionally choose to support HTML4 browsers or not. 
     return false; 
    } 

    // Bind to StateChange Event 
    History.Adapter.bind(window,'statechange',function() { // Note: We are using statechange instead of popstate 
     var State = History.getState(); 
     $('#content').load(State.url); 
     /* Instead of the line above, you could run the code below if the url returns the whole page instead of just the content (assuming it has a `#content`): 
     $.get(State.url, function(response) { 
      $('#content').html($(response).find('#content').html()); }); 
     */ 
     }); 


    // Capture all the links to push their url to the history stack and trigger the StateChange Event 
    $('a').click(function(evt) { 
     evt.preventDefault(); 
     History.pushState(null, $(this).text(), $(this).attr('onclick')); 
    }); 
}); 
</script> 

Answer 1

History.pushState의 첫 번째 매개 변수는 추가 정보는 "데이터"이다 (내가 할 몇 가지 링크가 정말 그래서 그냥 링크 내부의 온로드 퍼팅 기능이 나를 위해 옵션이되지 않을 것 필요). 밖으로 당신이 당신의 History.Adapter.bind 기능에 이런 짓을 했을까 다시 읽을 때 다음

History.pushState({ href: 'members.php' }, $(this).text(), $(this).attr('onclick')); 

과 :

그래서 당신은 당신의 클릭 이벤트에서이 작업을 수행 할 수있는 역사 항목을 저장합니다

$('#content').load(State.data.href);