Jquery 在回形针中上载没有表单或数据库的图像

我对Ruby不熟悉

我有一个DIV，其中有一个默认图像

我想在单击此图像或div时上载另一个图像。我不想将此图像保存到数据库。此外，我不想像大多数回形针教程所说的那样使用表单（如果有没有表单的方法的话）。

您想使用的。下面是我如何使用它的一个例子：

<div>
   <%= f.file_field :image, :id => "image" %>
   <output id="image_preview_output">
   </output>
</div>
<script>
$(document).ready(function() {
    // Check for the various File API support.
    if (window.File && window.FileReader && window.FileList && window.Blob) {
    } else {
        alert('The File APIs are not fully supported in this browser.');
    }
});
$('#image').change(function previewImage(evnt) {
    var file = evnt.target.files[0];
    // Only process image files.
    if (!project_featured_image.type.match('image.*')) {
        var reader = new FileReader();
        reader.onload = (function(theFile) {
            return function(e) {
                var span = document.createElement('span');
                span.innerHTML = ['<img id="image_preview" src="', e.target.result, '" title="', escape(theFile.name), '"/>'].join('');
                $('#image_preview_output').html(span);
            };
        })(file);
        // Read in the image file as a data URL.
        reader.readAsDataURL(file);
    }
});
</script>

“图像”%>
$（文档）.ready（函数（）{
//检查各种文件API支持。
if（window.File&&window.FileReader&&window.FileList&&window.Blob）{
}否则{
警报（'此浏览器不完全支持文件API'）；
}
});
$（“#图像”）.change（函数预览图像（evnt）{
var file=evnt.target.files[0]；
//仅处理图像文件。
如果（！project_characterized_image.type.match（'image.*'））{
var reader=new FileReader（）；
reader.onload=（函数（文件）{
返回函数（e）{
var span=document.createElement（'span'）；
span.innerHTML=[''）.join（''）；
$（'#图像_预览_输出'）.html（span）；
};
})（文件）；
//作为数据URL读入图像文件。
reader.readAsDataURL（文件）；
}
});

数据URL存储在本地，而不是数据库中。最终，如果您确实需要一个数据库，但不需要表单查找，请直接上传。绕过Rails服务器端处理的绝佳工具。