Question

我可以在弹出窗口中显示除图像之外的所有表单域。图像直接显示在表单上。它也应该在提交之前与弹出窗口一起显示在其他字段中。

function openPreview()
{
var title = document.getElementById("title").value;
var msg= document.ElementByClassName("nicEdit-main")[0].innerHTML;
var category = document.getElementById("category").value;
var status = document.getElementById("status").value;
var oFReader= new FileReader();
oFReader.readAsDataURL(document.getElementById("fileupload").files[0]);
oFReader.onload = function (oFREvent) {
document.getElementById("uploadPreview").src = oFREvent.target.result;
};
var popWin=window.open(title, 'Preview_Entry');
popWin.document.write('Title:' + title + '<br /> Message:' + msg + '<br /> Category: ' + category + '<br /> Status:' + status + oFReader);
}

Answer 1

最后一行的更改应该为您提供所需的输出

var oFReader= new FileReader();
var imgUrl;
oFReader.readAsDataURL(document.getElementById("fileupload").files[0]);
oFReader.onload = function (oFREvent) {
document.getElementById("uploadPreview").src = oFREvent.target.result;
imgUrl=oFREvent.target.result;
 };
var popWin=window.open(title, 'Preview_Entry');
popWin.document.write('Title:' + title + '<br /> Message:' + msg + '<br />     Category: ' + category + '<br /> Status:' + status + '<br />' +"<img src='" + imgUrl + "' /> );

Answer 2

加载图像数据后，您需要打开弹出窗口。这样您就可以相应地设置预览图像src。试试这个：

var oFReader= new FileReader();
oFReader.readAsDataURL( document.getElementById("fileupload").files[0]);
oFReader.onload = function (oFREvent) {
  var popWin=window.open('about:blank', 'Preview_Entry');
  popWin.document.write('Title:' + title +
    '<br /> Message:' + msg + 
    '<br />     Category: ' + category + 
    '<br /> Status:' + status + 
    '<br />' +
    '<img src="' + oFREvent.target.result + '" /> ');
  popWin.document.close();
};

使用javascript在上传之前在弹出窗口上预览图像

2 个答案: