上传文件或图片 type=file change事件只触发一次

来源：互联网发布：怎么注册淘宝编辑：程序博客网时间：2024/06/04 19:21

原因：该问题并不是由change事件失效造成的，而是ajaxFileUpload插件造成的，它会把原来的file元素替换成新的file元素，所以之前绑定的change事件就失效了，需要重新绑定一下

1.替换掉原来的input框

2.remove原来的input框，然后在添加进新的一样的input框

3.重新绑定change事件。

html

<input type="file" name="file" class="aside_file" id="upLoadImg"  v-on:change="updateLoadImg()" >

updateLoadImg:function(){    var self = this;    var fileId = "upLoadImg";    var fileSuffixs = 'image/jpg,image/jpeg,image/png';    var files = event.currentTarget.files[0];    var fileType = files.type;    if(files.size > 2097152) {        self.qnObjectValidate.qnqPicUrl = true;        return;    }    $.ajaxFileUpload({        url:'up/ntpl/uploadOriginal',        type:'post',        secureuri: false, //一般设置为false        fileElementId: fileId, //文件上传空间的id属性  <input type="file" id="file" name="file" />        dataType: 'json', //返回值类型 一般设置为json        success: function (res) {            if(res.status == 'success')            {                self.qnQuestionVo.qnqPicUrl = res.url;                self.qnObjectValidate.qnqPicUrl = false;            }        },        complete:function(){            $('#upLoadImg').change(function(){                self.updateLoadImg();            });        },        error: function(){            alert("上传图片失败!");        }    });},

0 0