將內容加載到iframe時，瀏覽器後退按鈕不起作用

我有一個javascript函數，當用戶單擊某個鏈接時，將顯示一些內容。將內容加載到iframe時，瀏覽器後退按鈕不起作用

function showContent(filename){ 
    var oldcontent = $('#content').html(); 
    var srcUrl = getSourceUrl(filename); 
    $('#content').html(oldcontent + '<iframe style="width:100%;height=100%;display:block;" src="'+srcUrl+'" />'); 
}

由於內容加載到iframe，URL不得到改變，我不能回去的地方，鏈接使用瀏覽器的後退按鈕前一頁。我是一個新手，我試圖做這樣的事情（愚蠢的實驗）。即將「＃page2」附加到url，但是當用戶單擊後退按鈕時，什麼都不會發生。

var oldcontent = $('#content').html(); 
var srcUrl = getSourceUrl(filename); 
location.href = location.href + '#page2'; 
$('#content').html(oldcontent + '<iframe style="width:100%;height=100%;display:block;" src="'+srcUrl+'" />');

任何人都可以告訴我這有什麼問題，以及如何啓用後退按鈕功能？

來源

2013-08-21 lloydh

查找到'hashchange'事件在舊的瀏覽器和'history.pushstate'在新的瀏覽器。 –

試試這個：

<!doctype html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title>Hash Test</title> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> 
    </head> 
    <body> 
    <div id='message-container'></div> 
    </body> 
    <script> 
    var messages = ["Hello. Click anywhere on the page.", "How are you?", "I hope you're fine.", "Have a nice day and hit the back button."]; 
    var currentMessage = 0; 
    var lastMessage = messages.length - 1; 

    $(document).click(function() { 
     nextMessage(); 
    }); 

    function nextMessage() { 
     if (currentMessage < lastMessage) { 
     currentMessage++; 
     updateHash(); 
     } 
    } 

    function displayMessage() { 
     $("#message-container").text(messages[currentMessage]); 
    } 

    function updateHash() { 
     window.location.hash = "#message" + currentMessage; 
    } 

    $(window).on("hashchange", function() { 
     if (/message\d+/.test(window.location.hash)) { 
     currentMessage = window.location.hash.match(/message(\d+)/)[1]; 
     displayMessage(); 
     } 
    }); 

    updateHash(); 
    </script> 
</html>

來源

2013-08-21 08:04:23 blvz

將內容加載到iframe時，瀏覽器後退按鈕不起作用

回答

相關問題