想在jsp页面上添加动态内容答案

【问题标题】：want to add dynamic content on jsp page想在jsp页面上添加动态内容
【发布时间】：2009-05-30 10:46:29
【问题描述】：

我在前端设计页面使用 Struts2 标签。

现在我需要在我的 jsp 页面中放置 3 个简单字段并在一些添加链接上，我想在同一表单中动态地重复一些另外 3 或 4 个字段。

例如，如果用户在添加链接上单击 5 次，那么 3 或 4 字段必须在 jsp 页面上显示 5 次。

我知道 ajax 可以用于此目的。但我仍然对如何实现它感到困惑。

如果有人有解决方案请回复...

提前谢谢....

【问题讨论】：

标签： java ajax jsp struts2

【解决方案1】：

您最好的方法是使用jquery 来简化javascript。这个简单的 html 页面演示了该方法：

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.min.js"/>
  </head>
  <body>
    <form method="post" action="#">
      <table>
        <tbody> 
          <tr>
            <td><input type="text" name="fieldname"/></td>
            <td><a href="#" onclick="$(this).closest('tr:not(:only-child)').remove();return false;">delete</a></td>
          </tr>
          <tr>
            <td><input type="text" name="fieldname"/></td>
            <td><a href="#" onclick="$(this).closest('tr:not(:only-child)').remove();return false;">delete</a></td>
          </tr>
        </tbody>
        <tfoot>
          <tr>
            <td></td>
            <td><a href="#" onclick="var tr = $(this).closest('table').find('tbody tr:first-child').clone(true); $(tr).find(':input').val(''); $(this).closest('table').find('tbody').append(tr); return false;">add</a>
            </td>
          </tr>
        </tfoot>    
      </table>
    </form>
  </body>
</html>

这是该方法的简要说明。每个重复元素都是表中行的一部分。您可以选择任何其他类型的容器来相应地调整 jquery。重复元素在每行的 tbody 内，有一个输入和一个删除该行的链接。请注意，只有当它不是 tbody 的唯一子级时，它才会删除该行。我们需要这样才能始终有办法从添加链接添加新元素。添加逻辑在 tfoot 中。添加链接在相应的 tbody 中找到第一个表行，将其克隆，清除任何输入字段中的所有值并将其作为新行附加到 tbody。

像我在本例中所做的那样，将这么多的 javascript/jquery 嵌入到属性中并不是一个好习惯。

【讨论】：