jQuery append（）和remove（）元素

我有一个表单，其中我动态添加了使用append函数上传文件的功能，但我也希望能够删除未使用的字段。下面是html标记

<span class="inputname">Project Images:
    <a href="#" class="add_project_file"><img src="images/add_small.gif" border="0"></a>
</span>
<span class="project_images">
    <input name="upload_project_images[]" type="file" /><br/>
</span>

我认为应该有一个更简单的方法来做到这一点。也许我需要使用$（this）函数来删除。另一种可能的解决方案是展开“添加项目文件”以添加和删除字段

---

你们中的任何一位JQuery向导都有非常好的想法

因为这是一个开放式的问题，我将告诉你们我将如何自己实现类似的东西

<span class="inputname">
    Project Images:
    <a href="#" class="add_project_file">
        <img src="images/add_small.gif" border="0" />
    </a>
</span>

<ul class="project_images">
    <li><input name="upload_project_images[]" type="file" /></li>
</ul>

---

您可以在追加之前调用重置函数。大概是这样的：

    function resetNewReviewBoardForm() {
    $("#Description").val('');
    $("#PersonName").text('');
    $("#members").empty(); //this one what worked in my case
    $("#EmailNotification").val('False');
}

---

你使用project_images作为类而不是ID有什么原因吗？不是真的，我倾向于将类用于可能在页面上出现多次的元素，而将ID用于只会使用一次的元素。这里没有真正的理由，我用一个类而不是一个IDThank，thank，thank，thank！我从没听说过“现场直播”，但我知道这是多么方便。对于文件列表使用

还有什么好处。这样我们就可以只删除我们想要的一个文件上传了吗？是的，这样我们就可以轻松地分别删除每个输入。它也是内容（文件列表）的更具语义的表示。如果您愿意，您也可以轻松地将它们包装在

span

或

div

标记中。哦，

live

只是jQuery（v1.3+）最新版本中的一项功能-您没有听说过它并不奇怪。live已被弃用，今后应该使用.on（）。

<span class="inputname">
    Project Images:
    <a href="#" class="add_project_file">
        <img src="images/add_small.gif" border="0" />
    </a>
</span>

<ul class="project_images">
    <li><input name="upload_project_images[]" type="file" /></li>
</ul>

// Add new input with associated 'remove' link when 'add' button is clicked.
$('.add_project_file').click(function(e) {
    e.preventDefault();

    $(".project_images").append(
        '<li>'
      + '<input name="upload_project_images[]" type="file" class="new_project_image" /> '
      + '<a href="#" class="remove_project_file" border="2"><img src="images/delete.gif" /></a>'
      + '</li>');
});

// Remove parent of 'remove' link when link is clicked.
$('.project_images').on('click', '.remove_project_file', function(e) {
    e.preventDefault();

    $(this).parent().remove();
});

    function resetNewReviewBoardForm() {
    $("#Description").val('');
    $("#PersonName").text('');
    $("#members").empty(); //this one what worked in my case
    $("#EmailNotification").val('False');
}