jQuery/JavaScript 从路径文件中读取图像/文件

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12686272/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 16:52:05  来源:igfitidea点击:

jQuery/JavaScript read image/files from path file

javascriptjqueryimagehtmlblob

提问by Eldon Lesley

I have a reference how to load an image from a file:

我有一个关于如何从文件加载图像的参考:

http://jsfiddle.net/eD2Ez/31/

http://jsfiddle.net/eD2Ez/31/

but I don't know how to manually load the image by inputting or giving a string parameter that contains path file (e.g. C:\myImage\img12.jpg)

但我不知道如何通过输入或提供包含路径文件的字符串参数(例如 C:\myImage\img12.jpg)来手动加载图像

in the link, the image is directly load from the file dialog.

在链接中,图像直接从文件对话框加载。

回答by Sev

Indeed, to my knowledge there is no established or even mildly known way to load local files programmatically due to security policies.

事实上,据我所知,由于安全策略,没有既定的或什至不为人所知的以编程方式加载本地文件的方法。

Aside from that you may want to use the onloadhandler on imgto be sure that the image is loaded when you draw it on canvas. At the moment in some cases where the image is too big or the computer is slow you may not get the image rendered.

除此之外,您可能希望使用onload处理程序img来确保在画布上绘制图像时加载图像。目前在某些图像太大或计算机速度较慢的情况下,您可能无法渲染图像。

Check demo: http://jsfiddle.net/eD2Ez/38/

检查演示:http: //jsfiddle.net/eD2Ez/38/

Experimental / Future

实验/未来

However, there could be a light on the horizon. There is something called FileSystem API in the works but didn't work for me (although it should).

然而,地平线上可能会有一丝曙光。有一种叫做 FileSystem API 的东西正在开发中,但对我不起作用(尽管它应该)。

Firstly the FileSystem API is currently implementedunder vendor prefix on Chrome version 21+.

首先,文件系统 API目前在 Chrome 21+ 版本的供应商前缀下实现

Also you have to use the flag --allow-file-access-from-fileswhen you launch Chrome.

您还必须--allow-file-access-from-files在启动 Chrome 时使用该标志。

But even with all this, I still didn't manage to make it happen with Chrome v21 and still get SECURITY_ERR.

但即使有这一切,我仍然没有设法通过 Chrome v21 实现它并且仍然获得SECURITY_ERR.

Check the "demo": http://jsfiddle.net/MQFGd/2/

检查“演示”:http: //jsfiddle.net/MQFGd/2/

Sources:

资料来源:

回答by Anton

   $('<img src="'+img.src+'"/>').insertAfter('#cvs');

Here is demo http://jsfiddle.net/eD2Ez/32/

这是演示http://jsfiddle.net/eD2Ez/32/