只加载选项卡上的jsp选项卡内容点击javascript?

时间:2012-02-18 12:21:50

标签: javascript jsp tabs multiview

我有一个JSP页面,其中包含四个选项卡和一个背景图像。我希望当我单击其中一个选项卡时,应该调用一个JSP函数,该函数只会更新单击的选项卡内容而不是整个页面和背景图像。类似的示例可以是ASP.NET中的Multiview控件

2 个答案:

答案 0 :(得分:2)

ASP.NET与普通JSP无法比较。 JSP更像“经典ASP”。如果您正在寻找ASP.NET(-MVC)的Java版本,请查看JSF。例如PrimeFacesa <p:tabView> component,我认为这正是您正在寻找的。

在普通的JSP中,您需要引入一些JavaScript代码来执行Ajax请求并操纵HTML DOM和一些Servlet来返回必要的数据。 jQuery以及jQuery UI可能对此有所帮助。

答案 1 :(得分:0)

没有你的代码,我们无能为力......

尝试以下代码,将div的内容图像更改为鼠标悬停在其他div上的其他图像。通过一些修改,它可以达到您的要求。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title><br />

</head>

<body>
<p>
  <script type="text/javascript" language="javascript">
function changeImage(img){
   document.getElementById('bigImage').src=img;

}
</script>

  <img src="../Pictures/lightcircle.png" alt="" width="284" height="156" id="bigImage" />
<p>&nbsp; </p>
<div>
  <p>
  <img src="../Pictures/lightcircle2.png" height=79 width=78 onmouseover="changeImage('../Pictures/lightcircle2.png')"/>

 </p>
 <p><img src="../Pictures/lightcircle.png" alt="" width="120" height="100" onmouseover="changeImage('../Pictures/lightcircle.png')"/></p>

 <p><img src="../Pictures/lightcircle2.png" alt="" width="78" height="79" onmouseover="changeImage('../Pictures/lightcircle2.png')"/></p>

 <p>&nbsp;</p>


  </br>
</div>
</body>
</html>

Link to the question