Question

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

现在我要求在我的jsp页面中放置3个简单的字段＆amp;在一些添加链接上，我想重复一些动态的相同形式的另外3或4个字段。

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

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

Plz回复是否有人有解决方案......

提前完成......

Answer 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中。 add链接找到相应tbody中的第一个表行，克隆它，清除任何输入字段中的所有值，并将其作为新行附加到tbody。

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

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

1 个答案: