jquerycropbox如何上传图片

Question

有一个 jquery 插件https://github.com/acornejo/jquery-cropbox。 我只是不明白如何提取这个裁剪的图像并将其放入 $_FILES(php)，所以我可以将它保存到我的服务器文件夹中。

Answer 1

您可以通过图像的 DATA 属性来完成。

要执行上述过程（加载图像文件的预览），HTML5 的 FileReader API。

使用 FileReader API 其实很简单，可以这样做：

Javascript

var logo = document.getElementById("logo").files[0]; // will return a File object containing information about the selected file
// File validations here (you may want to make sure that the file is an image)

var reader = new FileReader();
reader.onload = function(data) {
  // what you want to do once the File has been loaded
  // you can use data.target.result here as an src for an img tag in order to display the uplaoded image
  someImageElement.src = data.target.result; // assume you have an image element somewhere, or you may add it dynamically
}
reader.readAsDataURL(logo);

您可以将此代码放在 onchange 事件处理程序中，我猜您在这里不需要 AJAX。

然后当表单被提交时，图像数据就可以在它通常的位置获取，在 $_FILES 数组中。