[英]Capture image from mobile camera and preview before upload
Would anyone be able to point me in the right direction, I'm trying to write a small application for a web-site, where by the user can choose either an image, or choose to capture an image with their phone camera. 是否有人能够指出我正确的方向,我正在尝试为网站编写一个小应用程序,用户可以选择图像,或选择用手机摄像头捕获图像。
We can then display (preview) the image to them, and they can confirm it and carry on, or restart and take the image again. 然后我们可以向他们显示(预览)图像,他们可以确认并继续,或重新启动并再次拍摄图像。
I've found a few ways to do this using jQuery, which seemed to work well on a computer, However on a phone (tested using a Samsung S5 running the latest chrome) i frequently receive error messages saying that the previous operation could not be completed due to low memory. 我已经找到了一些方法来使用jQuery,这似乎在计算机上运行良好,但在手机上(使用运行最新chrome的Samsung S5测试)我经常收到错误消息,说前一个操作不能由于内存不足而完成。
Here is an example of the current code i'm using, this is stripped down somewhat just to show a basic example, but you can see the method doesn't seem very efficient: 这是我正在使用的当前代码的一个示例,这有点仅仅是为了显示一个基本示例,但您可以看到该方法似乎不是非常有效:
$(function() {
$("#prev-img-file").on("change", function()
{
var files = !!this.files ? this.files : [];
if (!files.length || !window.FileReader) return; // no file selected, or no FileReader support
if (/^image/.test( files[0].type)){ // only image file
var reader = new FileReader(); // instance of the FileReader
reader.readAsDataURL(files[0]); // read the local file
reader.onloadend = function(){ // set image data as background of div
$(".up-pic-preview").css("background-image", "url("+this.result+")");
}
}
});
});
http://jsfiddle.net/fish_r/vnu7661c/ http://jsfiddle.net/fish_r/vnu7661c/
Would anyone know of anything that doesn't hog as much resources? 有谁知道任何不会占用太多资源的东西?
Thanks! 谢谢!
One of the demo pages - test it on my android 4.4 phone minute ago - works fine :-) 其中一个演示页面 - 在我的Android 4.4手机上测试一分钟前 - 工作正常:-)
This library allows you to: 该库允许您:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.