2013-02-21 99 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