input file onchange事件不触发(第二次上传同名文件)/文件上传也可参考

首先, input的 onchange事件,input的value值改变, 才会触发. 第一次上传a文件, 会触发, 第二次上传该文件, 对于该input的value来说, 还是同一个值, 则不触发.
找到js代码中注意1的地方, 那一行, 重置了input 的value值. 第一次上传完以后, 无论成功还是失败, 这个input的值都是空, 因此, 再次上传同一文件的时候, 又会触发onchange事件. 完美~

html

<div class="input-box">
   <input type="file" name="feature" id="feature" accept="text/plain" @change="uploadPic1(this)">
   <button type="button"  class="btn btn-white m-l-sm float-left m-r-lg">文件上传(txt)</button>
 </div>

css

.input-box {
  display: inline-block;
  position: relative;
}

.input-box>input {
  width: 100%;
  height: 100%;
  padding-left: 10px;
  position: absolute;
  left: 0;
  opacity: 0;
}

//上传文件
    uploadPic1: function (el) { 
	var _this = this;

	// 获取file对象的数据
	var inputFiles = document.querySelector('#feature').files;
	console.log(inputFiles);

	if (inputFiles[0]) {
		var data = {
			file: inputFiles[0]
		};
		// console.log(data);

		request.txtUploadFile(data, function (res) {
			console.log('rrr', res)
			if (res.success) {
				_this.getBatchWithholdList();
				parent.layer.msg('上传成功', {
					icon: 1
				});
			} else {
				parent.layer.msg(res.resultMessage, {
					icon: 2
				})
			}
			$('#feature').val('') // 注意1
			
		});
	} else {
		parent.layer.msg('请选择文件', {
			icon: 2
		})
	}
			

},