如何清空input file中的文件

Question

如何清空input file中的文件

<div class="pic-box">

    <input type="file" id="upload" accept="image" @change="upload">

    <label for="upload"></label>

    <span class="add icon-plus"></span>

</div>

需要每上传一张图片将图片放在一个数组里面，但是原来的值中有文件。现在需要清空file中的文件以后上传第二章（暂不考虑多文件添加）

Answer 1

在input的change事件回调中把input的value清空即可typeof $ === "function" && $("#" + id).change(function () {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var reader = new FileReader();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; //读取文件以数据URI的形式保存在reader的result属性中&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; reader.readAsDataURL(this.files[0]);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; //获取图片大小,以M为单位&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var fileSize = Math.round(this.files[0].size / 1024 / 1024);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; //获取图片大小,以KB为单位&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var fileSizeKB = Math.round(this.files[0].size / 1024);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; //获取到图片后把input框内的图片删除,这样选同一张图片上传时才会触发change事件&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $(this).val("");&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; //上传图片的尺寸必需大于200KB//&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (fileSizeKB < 200) {//&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return that.alert("请上传尺寸大于200KB的图片！");//&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; //在图片读取完之前显示loading,因为手机上图片读取和压缩可能会比较耗时&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; that.loading("show");&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; reader.onload = function () {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ....&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; };&nbsp; &nbsp; &nbsp; &nbsp; })