2013-10-26 2 views
1

Я пытаюсь выяснить, History.js, следующий код работает, если вы перейдете на index.html, но если вы попытаетесь напрямую получить доступ к index.html?info, он отобразит содержимое индекса. Как именно вы должны обнаружить состояние, когда кто-то пытается напрямую получить доступ к index.html?info? Кроме того, я не уверен, правильно ли я делаю начальное состояние.History.js - обнаружение состояния при прямом доступе?

index.html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>title</title> 
    <script src="js/jquery-1.10.2.min.js"></script> 
    <script src="js/jquery.history.js"></script> 
</head> 
<body> 

    <div id="content"></div> 

    <script> 
     History.Adapter.bind(window, 'statechange', function() { 
      var id = History.getState().data.id; 

      if (id == "index") { 
       $('#content').html('<button id="btn" type="button">get info</button>'); 
       $('#btn').click(function() { 
        History.pushState({ id: "info" }, '', '?info'); 
       }); 
      } 

      if (id == "info") { 
       $('#content').html('here is some info'); 
      } 
     }); 

     History.pushState({ id: "index" }, '', '?index'); //do this otherwise nothing loads on first run 
    </script> 

</body> 
</html> 

ответ

1

Ну вы всегда толкая состояние индекса в вашем примере. Что вы могли бы сделать что-то вроде этого: Вместо History.pushState записи:

var p = window.location.search.replace("?", ""); //this gets you the parameter 
History.replaceState({id: p}, '', '?'+p); 

Однако история состояние сохраняется при обновлении и в качестве такового на обновления страницы событие StateChange не будет срабатывать, так как состояние Безразлично» t изменение.

Так идти вокруг этого вам нужно будет что-то вроде этого:

var historyFired = false; 

function onHistory() { 
    //put code previously in your statechange hanlder here 
    historyFired = true; 
} 

History.Adapter.bind(window,'statechange',onHistory); 

var p = window.location.search.replace("?", ""); //this gets you the parameter 
History.replaceState({id: p}, '', '?'+p); 

if (!historyFired) onHistory(); 

Это немного рубить, но это не то, что вы хотите, чтобы это сделать;

+0

Хорошо, это работает при прямом доступе к index.html? Info then. Но если вы обновите страницу, она будет пустой, даже если? Info находится в URL-адресе. Я чувствую, что что-то еще не так. – Roger

+0

Да, ты прав. Он не работает при обновлении. Вы можете использовать pushState вместо замены и посмотреть, работает ли он. Хотя это будет зависать, если пользователь сразу же нажал кнопку «Назад». – tomca32

+0

PushState, похоже, не имеет значения. – Roger

Смежные вопросы