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

时间:2015-02-18 09:36:38

标签: jquery file-upload clear

我有文件上传方法。它有添加,删除,清除字段。添加和删除工作完美。在clear方法中,我有两个文件输入值。当我单击clear时,两个输入值都被清除。我只想清除特定的文件输入值。

如何解决此问题

$('.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/

1 个答案:

答案 0 :(得分:2)

问题在于您的选择器。检查此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('');
        }
});