我想要一个包含多个部分的表格。
第一部分是图像,多个文件上传,并在实际上传之前预览图像。
第二部分有各种文本表单域。
我使用 PHP 和 MySQL 构建了第二部分并且可以正常工作,并且图像上传也可以正常工作。但我不知道如何在提交表单之前显示图像预览。
编辑:
使用代码形成答案:
<input type='file' onchange="readURL(this);" />
<img id="blah" src="#" alt="your image" />
和:
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#blah')
.attr('src', e.target.result)
.width(150)
.height(200);
};
reader.readAsDataURL(input.files[0]);
}
}
效果很好,但它只显示 1 个缩略图。我想为每个文件动态创建一个图像缩略图。
我正在努力 :
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
var container = $('#previews');
var image = $('<img>').attr('src', e.target.result).width(150);
image.appendTo(container);
};
reader.readAsDataURL(input.files[0]);
}
}
和:
<input type='file' name="files[]" onchange="readURL(this);" multiple />
<div id="previews"></div>
哪个有效,但是如何为每个输入的文件循环它?