我正在尝试访问移动设备上的相机和相册并获取所选图像。我用下面的代码做到了这一点。我的问题是,它生成图像数据,我必须将其传输到另一个页面,但由于生成的字符串的大小,我无法使用 URL 参数。它向我显示错误:[404] Request-URI Too long
。如何将信息传递到其他页面?
代码如下:http://jsfiddle.net/8u426/
JS:
<script>
oFReader = new FileReader();
oFReader.onload = function (oFREvent) {
document.getElementById("fotoImg").src = oFREvent.target.result;
document.getElementById("fotoImg").style.visibility = "visible";
var screenHeight = screen.availHeight;
screenHeight = screenHeight - 220;
document.getElementById("fotoImg").style.height = screenHeight;
document.getElementById("stringImg").innerText = "Data Image: " + oFREvent.target.result;
};
$(function() {
$("input:file").change(function (){
var input = document.querySelector('input[type=file]');
var oFile = input.files[0];
oFReader.readAsDataURL(oFile);
});
});
</script>
更新:
问题是:如果我尝试打开一个新页面,将数据图像字符串作为 URL 中的参数传递(带有“?”)。新页面将显示我提到的 404 错误,因为字符串太长。
最佳答案
尝试将您的表单更改为
<form id="form1" method="POST" action="[Page2 URL]">
<input id="filePic" type="file" name="image" accept="image/*" capture />
</form>
其中[Page2 URL]是接收上传图像的页面的URL。
和 JavaScript
oFReader = new FileReader();
oFReader.onload = function (oFREvent) {
var screenHeight = screen.availHeight;
screenHeight = screenHeight - 220;
var img = $('#fotoImg');
img.attr('src', oFREvent.target.result);
img.css( { height : screenHeight, visibility: 'visible' });
$("#stringImg").text( "Data Image: " + oFREvent.target.result);
$('#form1').submit();
};
$(function() {
$("input:file").change(function (){
var oFile = this.files[0];
oFReader.readAsDataURL(oFile);
});
});
关于javascript - 将图像数据传递到另一个页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18801434/