在javascript中单击标签时仅加载jsp标签内容？答案

【问题标题】：Loading only jsp tab contents on tab click in javascript?在javascript中单击标签时仅加载jsp标签内容？
【发布时间】：2012-03-09 14:40:18
【问题描述】：

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

【问题讨论】：

标签： javascript jsp tabs multiview

【解决方案1】：

ASP.NET 无法与普通的 JSP 相提并论。 JSP 更能与“经典 ASP”相媲美。如果您正在寻找 ASP.NET(-MVC) 的 Java 对应物，请查看 JSF。 PrimeFaces 例如有 a <p:tabView> component，我认为这正是您正在寻找的。p>

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

【讨论】：

PrimeFaces 真的很棒 BalusC。我会试一试。非常感谢。但我仍然想要一个不使用第三方库的代码。任何人请帮助...
好吧，只需相应地编写 JavaScript/Ajax 和 Servlet 代码即可。你对它很熟悉，我猜？如果没有，我会开始学习它。 MDN 有一个非常好的 JS/Ajax 教程。毕竟只需要几周甚至几个月而不是几个小时甚至更少的时间来完成它，并具有相同程度的健壮性和跨浏览器兼容性。如果您遇到特定的编码问题，您可以随时在此处发布问题。
感谢 BalusC，但我没有足够的时间来学习新事物。我必须尽快提交我的项目。非常感谢您的帮助:) 我会先尝试使用 PrimeFaces

【解决方案2】：

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

尝试以下代码，将鼠标悬停在其他 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

【讨论】：