有没有人看到错误或者可以帮助我如何在这段代码中调试我在输入中选择图像的原因总是显示“没有文件选择”消息。一切正常但是因为DOM就像在那一刻没有选择文件所以我无法验证输入。提前谢谢。
Html部分:
<span id="freeInputFile" class="btn btn-success fileinput-button-creator">
<i class="glyphicon glyphicon-plus"></i>
<span>Add files...</span>
<input id="freeRoomInputV2" type="file" name="filesFree" accept="image/png,image/gif,image/jpeg,image/jpg"/>
</span>
<br />
<div id="progress" class="progress">
<div class="progress-bar progress-bar-success"></div>
</div>
<div class="percent">0%</div>
<div id="status"></div>
<div id="filesFree" class="files"></div>
</div>
javascript部分(使用查询文件上传):如果有帮助:该按钮附加在预览缩略图img的不同标签中。
$(function () {
'use strict';
var urlv2 = ROOT_PATH+'/uploader/',
uploadButtonv2 = $('<button/>')
.addClass('btn btn-primary beButtonFormat create_free_room')
.prop('disabled', true)
.text('Processing...')
.on('click', function () {
var $this = $(this),
data = $this.data();
$this
.off('click')
.text('Abort')
.on('click', function () {
$this.remove();
data.abort();
});
data.submit().always(function () {
$this.remove();
});
});
$('#freeRoomInputV2').fileupload({
url: urlv2,
dataType: 'json',
autoUpload: false,
maxNumberOfFiles: 1,
maxFileSize: 5000000, // 5 MB
disableImageResize: /Android(?!.*Chrome)|Opera/
.test(window.navigator.userAgent),
previewMaxWidth: 100,
previewMaxHeight: 100,
previewCrop: true
})
.on('fileuploadsubmit', function (e, data) {
})
.on('fileuploadadd', function (e, data) {
$("#filesFree").empty();
data.context = $('<div/>').appendTo('#filesFree');
data.context2 = $('<div/>').appendTo('#upload_button_free');
$.each(data.files, function (index, file) {
var node = $('<p/>')
.append($('<span/>').text(file.name)),
node2 = uploadButtonv2.clone(true).data(data);
if (!index) {
node
.append('<br>');
}
node.appendTo(data.context);
node2.appendTo(data.context2);
});
}).on('fileuploadprocessalways', function (e, data) {
var index = data.index,
file = data.files[index],
node = $(data.context.children()[index]);
if (file.preview) {
node
.prepend('<br>')
.prepend(file.preview);
}
if (file.error) {
node
.append('<br>')
.append($('<span class="text-danger"/>').text(file.error));
}
if (index + 1 === data.files.length) {
data.context2.find('button')
.text('Upload')
.prop('disabled', !!data.files.error);
}
}).on('fileuploadprogressall', function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$('#progress .progress-bar').css(
'width',
progress + '%'
);
}).on('fileuploaddone', function (e, data) {
}).on('fileuploadfail', function (e, data) {
$.each(data.files, function (index, file) {
var error = $('<span class="text-danger"/>').text('File upload failed.');
$(data.context.children()[index])
.append('<br>')
.append(error);
});
}).prop('disabled', !$.support.fileInput)
.parent().addClass($.support.fileInput ? undefined : 'disabled');
});