2013-02-21 97 views
0

我一直在試圖編寫一個網站,其中所有導航都是通過隱藏和顯示div來處理的。我的理解是這種方法稱爲單頁面接口。這在過去簡單的設計中很有效,但我目前的任務開始變得非常麻煩,使用這種方法。我將如何去複製相同的行爲,而不是隱藏和顯示div,我可以只有一個主容器div,然後填充所需的html從服務器?帶有動態html的JSP頁面

例子:

<script> 
    $("#button").onclick(function() { 
     $("#a").show(); 
     $("#b").hide(); 
    }); 
</script> 

<html> 
    <body> 
     <div id="a" style="display:none;">A: SOME HTML</div> 
     <div id="b" style="display:block;">B: SOME HTML</div> 
     <button id="button">Change to A</button> 
    </body> 
</html> 

(注意,這是白色的,我試圖做一個非常粗略的例子)

但我想一個容器div的內容從「B」變更到「A」通過一些jp

任何人都可以指向正確的方向嗎?

更多解釋:

也許我可以澄清一點。因此,當用戶加載頁面時,會顯示一個包含數據庫中所有現有文件的表的部分。用戶可以從數據庫列表中選擇一個文件進行重命名或複製。例如,如果用戶希望重新命名文件,則它們將被呈現以新的顯示(全部在相同的「標籤」內),其將具有針對他們已經選擇的文件填充的一組字段以及一組空字段他們可以在其中指定新的文件名。目前,這種顯示變化是通過顯示和隱藏div來處理的,但是我想檢索我想要從服務器顯示的html並顯示它。基本上模仿隱藏和顯示div。

+0

更好地理解它 - 做ü意味着標籤元素 - 例如:http://jqueryui.com/tabs/ – user1428716 2013-02-21 04:10:40

+0

那麼我試圖開發的接口確實涉及選項卡元素。但在每個選項卡中,可以完成各種不同的任務。例如,在一個選項卡下,用戶可以上傳,重命名或複製文件。在另一個標籤下,可以編輯各種設置等。但標籤不是問題,它是每個標籤中的內容。 – 2013-02-21 05:37:28

回答

0

,因爲它不是完全清楚,我你想要做什麼我都會給你一些選項是什麼:

  1. 更換你的頁面上的元素的內容看
  2. 由於您使用一個JSP,你可以使用服務器端邏輯
  3. 你正在使用JSP顯示某些片段,用它來渲染一些服務器端內容

廣告1:

(假設jQuery的)$('body').load('serverSide.html');看到http://api.jquery.com/load/

廣告2:

<% if ("a".equals(request.getParameter("aOrB"))) { %> 
<jsp:include page="/a.jspf"> 
<% } else { %> 
<jsp:include page="/b.jspf"> 
<% } %} 

廣告3:

<%= request.getAttribute('content') %> 

希望幫助

+0

所以說我有一塊html,我希望顯示在存儲在服務器上的div中。我可以指定$(「#targetDiv」)。load(「desired.html」);並且在「targetDiv」中顯示的「desired.html」中的html都格式化了,而且是什麼? – 2013-02-21 16:27:33

+0

是的,請參閱http://jsbin.com/ayukof/1/edit – Friso 2013-02-21 19:24:21

+0

謝謝!這很好。這與history.pushstate()相結合正是我一直在尋找的。 – 2013-02-21 20:24:21