2014-04-01 78 views
-1

iam realy新的jquery中遇到了一些問題。jquery在DIV中加載內容,讓回按鈕再次工作

我用.load()將所有不同的頁面加載到一個DIV中。

但是,如果我這樣做,後面的按鈕沒有工作。

我如何獲得後退按鈕?

我在這裏閱讀了一些解決方案,但沒有讓他們工作。任何人都可以用我的代碼幫助我嗎?

這是我的index.html(部分)

$(document).ready(function() { 

$("#mainframe").load("start.html"); 

//Geschichtebutton 
$(".historyspan").click(function() { 
$('input[name=on-check]').attr('checked', false); 
$('#greybox').css({'display': 'none'}); 
$('input[name=radio-check]').attr('checked', false); 

$("#mainframe").load("geschichte.html"); 
}); 

//Teambutton 
$(".teamspan").click(function() { 
$('input[name=on-check]').attr('checked', false); 
$('#greybox').css({'display': 'none'}); 
$('input[name=radio-check]').attr('checked', false); 

$("#mainframe").load("team.html"); 
}); 

//Umweltbutton 
$(".umweltspan").click(function() { 
$('input[name=on-check]').attr('checked', false); 
$('#greybox').css({'display': 'none'}); 
$('input[name=radio-check]').attr('checked', false); 

$("#mainframe").load("umwelt.html"); 
}); 

}); 
+0

這是創建的網頁,並在它們之間進行導航的一個非常有缺陷的方法。您正在等待文檔準備就緒,然後您正在加載文檔。這將是一個糟糕的用戶體驗。您的後退按鈕不起作用,因爲您實際上並未導航到不同的頁面,您正在將新內容加載到現有頁面中。沒有什麼可返回的。 –

+0

你的後退按鈕在哪裏?你告訴關於瀏覽器後退按鈕? – Arka

+0

使用'hash'和'''插件。請在Google上搜索 – Bellash

回答

1

你基本上需要用歷史的API來實現自己的自定義的URL放在一起:

https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history

簡單地說,你會是什麼需要做的是,每當您​​新頁面時,都會在瀏覽器歷史記錄中推送一個新狀態。您還應該更新瀏覽器中的網址。通過這種方式,用戶可以使用後退按鈕瀏覽不同的歷史狀態。

認爲有跨越舊的瀏覽器incosistencies,所以你可能需要使用history.js http://balupton.github.io/history.js/demo/或類似