Javascript 动态删除动态添加的输入（类型=文件）

我有一个表单，用户可以添加文件上传。该输入上的Change事件添加相同类型的新输入，以此类推。但是，新输入必须具有“X”字符，并附带click事件，才能删除输入字段和X字符

表格：

  <form id="upload_form">
     <div class="p_file">
        <p class="icon">X</p>
        <input type="file" name="userfile1" size="40"  class="required"  />
     </div>
  </form>

X

还有JavaScript：

   $('#upload_form input[type="file"]').change(function(){
       addUploadField($(this));
   });  

   function addUploadField($field)
   {
       $current_count = $('#upload_form input[type="file"]').length
       $next_count = $current_count + 1;
       $field.parent('p').after('
            <div class="p_file" >
                <p class="icon">X</p>
                <input type="file" name="userfile'+$next_count+'" size="40" />
            </div>
        ');
        $field.unbind('change');
        $nextField = $('#upload_form input[type="file"]').last(); 
        $nextField.bind('change',function(){
        addUploadField($(this));
     });

     $("#upload_form .icon").on('click',function(){
         removeUploadField($field);
     });
   }

 function removeUploadField($field)
 {
     $field.parent('p').remove();
 }

$（'#上传表单输入[type=“file”]”）。更改（函数（）{
addUploadField（$（this））；
});  
函数addUploadField（$field）
{
$current_count=$（'#上传表单输入[type=“file”]”）。长度
$next_count=$current_count+1；
$field.parent（'p'）。在（'
X
');
$field.unbind（'change'）；
$nextField=$（“#上传表单输入[type=“file”]”）。last（）；
$nextField.bind（'change'，function（））{
addUploadField（$（this））；
});
$（“#upload_form.icon”）。在（'click'，function（）上{
removeUploadField（$field）；
});
}
函数removeUploadField（$field）
{
$field.parent（'p'）.remove（）；
}

上面的代码将删除单击的“X”字符后的所有字段。我想做的是只删除下一个输入字段

我试着准备，但我做不到。无论如何，这可能会有所帮助。

将“div”标记放在“p”标记内是主要问题

---

删除在该代码中被更正

注意：在html代码中，在“p”标记内添加了“div”，这是无效的做法

HTML:

X

脚本：

$('body')
    .delegate('#upload_form input[type="file"]', 'change', inputChanged)
    .delegate('#upload_form .icon', 'click', removeField);

function inputChanged() {

    $current_count = $('#upload_form input[type="file"]').length;
    $next_count = $current_count + 1;
    $(this).closest('.p_file').after(
            '<div class="p_file" ><div class="icon">X</div>' +
            '<input type="file" name="userfile'
            + $next_count + '" size="40" /></div>');
}

function removeField(){
    $(this).closest('.p_file').remove();
    return false;
}

$（“正文”）
.delegate（“#上传”_表单输入[type=“file”]，“更改”，输入更改）
.delegate（“#上传表单图标”、“单击”、“删除字段”）；
函数inputChanged（）{
$current_count=$（'#upload_form input[type=“file”]）。长度；
$next_count=$current_count+1；
$（this）.最近（'.p_文件'）。之后(
“X”+
'');
}
函数removeField（）{
$（this）.closest（'.p_文件'）.remove（）；
返回false；
}

链接：

$('body')
    .delegate('#upload_form input[type="file"]', 'change', inputChanged)
    .delegate('#upload_form .icon', 'click', removeField);

function inputChanged() {

    $current_count = $('#upload_form input[type="file"]').length;
    $next_count = $current_count + 1;
    $(this).closest('.p_file').after(
            '<div class="p_file" ><div class="icon">X</div>' +
            '<input type="file" name="userfile'
            + $next_count + '" size="40" /></div>');
}

function removeField(){
    $(this).closest('.p_file').remove();
    return false;
}