1

我正在尝试手动将 img src 设置为文件系统上的路径，然后我想在画布上绘制该图像。我在用：

    var curr_canv = document.getElementById('c_main').getContext('2d');
    var img = new Image();

    img.width = 525;
    img.height = 400;

    img.src = "..\AAAA\BBBB\CCCC\myimage.jpg";

    curr_canv.drawImage(img,0,0);

但是在我这样做之后，画布上什么也没有画出来。有什么想法吗？

4

5 回答 5

2

您需要将路径设置为webserver中的绝对路径。
浏览器中的 Javascript 无法访问任何文件系统。

于 2012-09-13T19:38:17.587 回答
1

您正在使用

\ 
(backslash)

代替

/ 
(forward-slash).

JavaScript\用作转义字符。

于 2012-09-13T19:39:24.840 回答
0

是的，路径必须在 web 文件夹或其他可访问的路径中。你可以看到你的代码在这里一般工作：http: //jsfiddle.net/pwm36/8/

于 2012-09-13T19:42:40.360 回答
0

简短的回答是“你不能那样做”。在浏览器中运行的 Javascript 无法直接访问用户的文件系统。这是一般浏览器的安全功能。

HTML5 有一个相对较新的 FileSystem API，但它可能仍然无法满足您的需求，因为浏览器仍然“被监禁”。您无法访问浏览器保留的目录之外的任何文件。

您可能会考虑拖放 API。用户可以将文件拖放到您指定的区域，我认为您可以使用 Javascript 访问它。

于 2012-09-13T19:48:20.107 回答
0

就像其他人说的那样，您需要使用网络服务器提供的图像。或者使用“file://”协议。

请注意，将图像加载到您希望仅在加载图像后才能绘制的异步大头针中。

img.onload = function() {
   curr_canv.drawImage(img,0,0);
}

有关更多信息，请参阅MDN。

于 2012-09-13T20:08:36.950 回答