Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/73.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 将图像从一个.jsp传递到另一个.jsp_Javascript_Html_Jsp - Fatal编程技术网

Javascript 将图像从一个.jsp传递到另一个.jsp

Javascript 将图像从一个.jsp传递到另一个.jsp,javascript,html,jsp,Javascript,Html,Jsp,我正在学习JSP,无法找到以下问题的答案: 我想上传一个页面中的图像文件,将其传递到另一个页面,并在那里显示,如(基于问题): first.jsp <form method="post" onsubmit="save()" action="second.jsp" enctype="multipart/form-data"> <input type="file" name="openFile" onchange="reloadPreview()"> <

我正在学习JSP,无法找到以下问题的答案:

我想上传一个页面中的图像文件,将其传递到另一个页面,并在那里显示,如(基于问题):

first.jsp

<form method="post" onsubmit="save()" action="second.jsp" enctype="multipart/form-data">
    <input type="file" name="openFile" onchange="reloadPreview()">
    <canvas name="preview"></canvas>
    <input type="submit" value="Save"/>
</form>
<script>
    function reloadPreview(){
        var preview = document.getElementsByName("preview")[0];
        var file    = document.getElementsByName("openFile")[0].files[0];
        var reader  = new FileReader();
        var picture = new Image;

        reader.onloadend = function () {
            picture.src = reader.result;
            preview.width = picture.width;
            preview.height = picture.height;
            var context = preview.getContext("2d");
            context.drawImage(picture, 0, 0);
            dataUrl = preview.toDataURL();
        };

        if (file) {
            reader.readAsDataURL(file);
        }
   }

    function save() {
        window.location = "second.jsp?imgUrl="+dataUrl;
        document.getElementById("form").submit();
    }

   var dataUrl;
</script>

函数重载预览(){
var preview=document.getElementsByName(“预览”)[0];
var file=document.getElementsByName(“openFile”)[0]。文件[0];
var reader=new FileReader();
var图片=新图像;
reader.onloadend=函数(){
picture.src=reader.result;
preview.width=picture.width;
preview.height=picture.height;
var context=preview.getContext(“2d”);
drawImage(图片,0,0);
dataUrl=preview.toDataURL();
};
如果(文件){
reader.readAsDataURL(文件);
}
}
函数save(){
window.location=“second.jsp?imgUrl=“+dataUrl;
document.getElementById(“表单”).submit();
}
var-dataUrl;
1) 如何从
second.jsp
访问画布内容

2) 我是否可以访问
openFile
文件而不将其上载到
canvas
(例如,如果文件不是图像)?

来源:

<%session.setAttribute("Down1","download.png");%>
<td>Image: </td>
<td><img src="download.png" width="516" height="516" alt="Down" name="Down1"/></td>

图片:
目的地:

<td><img src="download.png" width="516" height="516" alt="Down" name="Down1"/></td>

过程是1)以URL可以访问的方式将文件上传到服务器,2)以某种方式将URL(会话属性、数据库等)传递到第二个JSP,以便使用它生成正确的HTML/JS代码。此答案不会试图回答问题中明确提到的两个问题。