我在javascript
内使用以下rails 5 app
,以便在提交表单之前预览图片。
图像表单字段具有多个文件的设置,但javascript只有一个设置。我可以预览多个图像,但最终只能上传一个。
如何进行此javascript预览并上传多张图片?
<script>
function handleFileSelect(event)
{
console.log(event)
var input = this;
if (input.files && input.files[0])
{
var reader = new FileReader();
console.log(reader)
reader.onload = (function (e)
{
var span = document.createElement('span');
span.innerHTML = ['<img class="thumb" src="',e.target.result, '" title="', escape(e.name), '"/><span class="remove_img_preview"></span>'].join('');
document.getElementById('preview').insertBefore(span, null);
});
reader.readAsDataURL(input.files[0]);
}
}
//su kien thay doi hinh khac
$('#files').change(handleFileSelect);
//day la su kien click vao nut x để xóa ảnh
$('#preview').on('click', '.remove_img_preview',function ()
{
$(this).parent('span').remove();
$(this).val("");
});
</script>