这个问题并不是由change事件失效造成的,而是ajaxFileUpload插件造成的,它会把原来的file元素替换成新的file元素,所以之前绑定的change事件就失效了,需要重新绑定一下。
$('#uploaderInput').on("change",function() {
$.ajaxFileUpload({
url : '/upload/imageUpload', //提交的路径
secureuri : false, // 是否启用安全提交,默认为false
fileElementId : 'uploaderInput', // file控件id
dataType : 'json',
data : {
fileName : $('#uploaderInput').val() //传递参数,用于解析出文件名
}, // 键:值,传递文件名
success : function(data, status) {
if (data.error == 0) {
var src = data.src;
$('#uploaderFiles').append("<img class='weui-uploader__file weui-uploader__file_status' src='" + src + "' style='width:100%;height:100%'>");
$("#uploaderInput").val("");
// 存储已上传图片地址
var oldSrc = $('.pictureSrc').val();
var newSrc = "";
if (oldSrc != "")
newSrc = oldSrc + "," + src;
else
newSrc = src;
$('.pictureSrc').val(newSrc); //保存路径
} else {
alert(data.message);
}
},
error : function(data, status) {
alert(data.message);
}
});
});
<input type=”file” value=”” name=”logo_name” id=”logo_name”>
jquery绑定事件只走一次,找了好多办法都不行
今天我来把这个神秘的问题给解决一下,希望能帮助大家
$(document).off(‘change’,’#logo_name’).on(‘change’,’#logo_name’,function(){
alert(“ok”);
});这么去写,就把change执行一次给解决掉了,因为on是绑定了结点,jquery绑定结点的时候只需绑定一次就行了。不能重复绑定,off是将结点移除,移除完之后在重新绑定,这样就可以解决了change执行一次的问题
$(document).off('change','#uploaderInput').on('change','#uploaderInput',function(){
$.ajaxFileUpload({
url : '/upload/imageUpload', //提交的路径
secureuri : false, // 是否启用安全提交,默认为false
fileElementId : 'uploaderInput', // file控件id
dataType : 'json',
data : {
fileName : $('#uploaderInput').val() //传递参数,用于解析出文件名
}, // 键:值,传递文件名
success : function(data, status) {
if (data.error == 0) {
var src = data.src;
$('#uploaderFiles').append("<img class='weui-uploader__file weui-uploader__file_status' src='" + src + "' style='width:100%;height:100%'>");
$("#uploaderInput").val("");
// 存储已上传图片地址
var oldSrc = $('.pictureSrc').val();
var newSrc = "";
if (oldSrc != "")
newSrc = oldSrc + "," + src;
else
newSrc = src;
$('.pictureSrc').val(newSrc); //保存路径
} else {
alert(data.message);
}
},
error : function(data, status) {
alert(data.message);
}
});
});