文件上传 单独清除文件输入值

Question

我有文件上传 method.Its 添加、删除、清除 fields.Add 和删除工作完美。在清除方法中，我有两个文件输入 values.when 我单击清除两个输入值都被清除。我只想清除特定文件的输入值。

如何解决这个问题

$('.multi-field-wrapper').each(function() {

   var $wrapper = $('.multi-fields', this);    

   $(".add-field", $(this)).click(function(e) {    
    $('.multi-field:first-child', $wrapper).clone(true).appendTo($wrapper).find('input').val('').focus();   
   });

   $('.multi-field .remove-field', $wrapper).click(function() {
    if ($('.multi-field', $wrapper).length > 1)
     $(this).parent('.multi-field').remove();
   }); 

   $('.multi-field .clear-field', $wrapper).click(function() {
    //if ($('.multi-field', $wrapper).length > 1)
    if(navigator.userAgent.toUpperCase().indexOf('MSIE') >= 0){
     $("input[type='file']").replaceWith($("input[type='file']").clone(true));
    } else {
     $("input[type='file']").val('');
    }
   }); 
});

<div class="multi-field-wrapper">
  <div class="multi-fields">
    <div class="multi-field">
      <input type="file" value="choose files" id="attach" name="attach[]" onchange="check_file_sizes();"/>
      <button type="button" class="remove-field">Remove</button>
      <button type="button" class="clear-field">Clear</button>
      <!--<button type="button" id="clear" >Clear</button> -->                            
    </div>
  </div>
  <button type="button" class="add-field">Add field</button>                          
</div>

http://jsfiddle.net/techpalani/987ry6nn/1/

Answer 1

问题出在您的选择器上。检查此 Fiddle。您应该按如下方式更改 clear 函数：

$('.multi-field .clear-field', $wrapper).click(function() {
        //if ($('.multi-field', $wrapper).length > 1)
        if(navigator.userAgent.toUpperCase().indexOf('MSIE') >= 0){
          $(this).closest('.multi-field').find("input[type='file']").replaceWith($("input[type='file']").clone(true));
        } else {
          $(this).closest('.multi-field').find("input[type='file']").val('');
        }
});