显示预览图像，在提交表单上传-Java 学习之路

我正在使用jquery插件transloadit将图像上传到我的amazon s3存储桶 .
我现在所拥有的只是一个简单的调整大小并上传到亚马逊的图像文件夹 .

现在我想在一个包含其他输入字段的表单中使用上传器 . 如果在单击图像上载按钮时选择图片，则会获得图像预览，但图像尚未上载 . 当您单击整个表单的“提交”时，图像将被上传 .

有人可以帮我这个或者让我继续前进吗？

这是我将图像上传到亚马逊的代码：

<form id="UploadForm" action="/index/upload" enctype="multipart/form-data" method="POST">
<input type="file" name="my_file" multiple="multiple" />

$(function() {
    // We reference our html form here
    $('form#UploadForm').transloadit({
        wait: true,
        triggerUploadOnFileSelection: true,
        params: {
            auth: { key: "key" },
            template_id: "templateid"
        }
    });
});


public function uploadAction()
{
    $this->_helper->layout->disableLayout();
    $this->_helper->viewRenderer->setNoRender();

    $transloaditData = $_POST['transloadit'];
    if (ini_get('magic_quotes_gpc') === '1') {
        $transloaditData = stripslashes($transloaditData);
    }
    $transloaditData = json_decode($transloaditData, true);

    foreach ($transloaditData['uploads'] as $upload) {
        // do something with the uploaded file here
    }

    foreach ($transloaditData['results'] as $encodingResult) {
        // do something with the encoding result here here,
        // like saving its URL to the database
    }
}

1 回答

尝试文件阅读器

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $('#blah').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}

$("#imgInp").change(function(){
    readURL(this);
});

http://jsfiddle.net/LvsYc/

回复于 2024-04-28T15:39:43+08:00

显示预览图像，在提交表单上传

1 回答

相关问题