2012-10-26 136 views
1

在一个按钮上单击我调用一个脚本来获取画布图像。我采取的位置。我需要将此图像源传递到另一个需要显示此图像的jsp文件。如何将图像从一个jsp传递到另一个jsp

你能帮我解决这个问题吗?

<%@ page contentType="text/html;charset=UTF-8" %> 
<html> 
<head> 
    <script> 
     function draw() { 
      var canvas = document.getElementById("canvas"); 
      var ctx = canvas.getContext("2d"); 
      ctx.fillStyle = "black"; 
      ctx.beginPath(); 
      var x; 
      var y; 
      canvas.onmousedown = function(e) { 
       x = e.clientX; 
       y = e.clientY; 
       ctx.moveTo(x, y); 
      } 
      canvas.onmouseup = function(e) { 
       x = null; 
       y = null; 
      } 
      canvas.onmousemove = function(e) { 
       if (x == null || y == null) { 
        return; 
       } 
       x = e.clientX; 
       y = e.clientY; 
       x -= canvas.offsetLeft; 
       y -= canvas.offsetTop; 
       ctx.lineTo(x, y); 
       ctx.stroke(); 
       ctx.moveTo(x, y); 
      } 
     }; 
     function to_image(){ 
      var canvas = document.getElementById("canvas"); 
      document.getElementById("theimage").src = canvas.toDataURL(); 
     } 
     function clear_image(){ 
      var canvas = document.getElementById('canvas'); 
      var context = canvas.getContext('2d'); 
      context.fillStyle = '#ffffff'; 
      context.clearRect(0, 0, canvas.width, canvas.height); 
      canvas.width = canvas.width; 
     } 
    </script> 
</head> 
<body onload="draw();"> 
<canvas id="canvas" width="300" height="300" 
style="border: 1px solid black;"></canvas> 
<div><button onclick="to_image()">Draw to Image</button></div> 
<div><button onclick="clear_image()">Clear</button></div> 
<image id="theimage"></image> 
</body> 
</html> 

我需要传递的document.getElementById(“theimage”)的值。SRC到另一个jsp和访问该值dispaly图像。

有人能帮我解决这个问题吗?

回答

0

如果你的意思是,你会加载第二个页面图像上从第一页点击一个按钮(您已粘贴代码),那么只需更新代码:

{ 

     var canvas = document.getElementById("canvas"); 
     var dataUrl = canvas.toDataURL(); 

     //-- Following code can be placed wherever you want to call another page. 
     window.location = "urlToSecondJSPPage.jsp?imgUrl="+dataUrl; 

    } 

然后imgUrl的(URL参数)可以从第二页访问。

相关问题