1

我正在尝试访问移动设备上的相机和相册并获取所选图像。我用下面的代码做到了。我的问题是，它生成图像数据，我必须将其传输到另一个页面，但是由于生成的字符串的大小，我不能使用 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 错误，因为字符串太长。

4

2 回答 2

1

尝试将您的表格更改为

<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);
    });
});
于 2013-09-14T13:33:12.193 回答
0

我无法使用 php（考虑到我不想使用 php）和 html 表单（方法获取和发布）......所以我使用了名为“ jQuery Storage ”的 jQuery 库。

这很简单，在我选择您应该使用的图像的页面上：

$.sessionStorage([key],[value]);

所以，是这样的：

$.sessionStorage('chosenImg', document.getElementById("photoImg").src);

在新页面中，要获取值，只需添加代码：

$.sessionStorage('chosenImg');

当然，我必须从网站下载 de .js 库，并在两个 html 页面上添加以下行：

<script src="jquery.storage.js"></script>

唯一不方便的是它对于移动设备来说有点重，但这是我发现的唯一方法......

这就对了！感谢大家！

于 2013-09-15T14:14:59.830 回答