为什么Jquery图片上传器不上传图片 [英] Why Jquery image uploader doesn't upload image

问题描述

此代码摘自使用PHP上传的AJAX图片这些文件的代码:index.html，style.css，script.js，ajax_php_file.php并下载了NoImage.jpg.然后，我从PC上选择了图像，并且照片已在客户端更改为所选图像.然后，我单击了上传"，没有文件上传到调用php脚本的文件夹中.在Firefox 32 Firebug控制台中进行了测试，未报告任何错误.我还尝试使用Jquery 2.2.2进行此操作，但错误告诉我e.preventDefault();.被描述.因此，您能告诉我代码有什么问题吗?它也不会在Opera中上载.我看到有更多的ppl在脚本的原始页面上询问此问题，但答案仍然没有得到响应.

This code is taken from AJAX Image upload using PHP I have copied the code to these files: index.html, style.css, script.js, ajax_php_file.php and downloaded NoImage.jpg. Then I selected the image from my PC and the photo has been changed on client side to the selected image. Then I clicked upload and no file has been uploaded to the folder where php script was called. Tested in Firefox 32 Firebug console and no errors reported. I also tried this with Jquery 2.2.2 with error telling me that e.preventDefault(); is depricated. Hence can you tell me what is wrong with the code? It does not upload in Opera neither. I see there is more ppl asking this on the origin page of the script but the answer stays not responded.

我尝试在reader.readAsDataURL(this.files[0]);之后添加此代码$("#uploadimage").submit();，但这也无济于事.

I tried this code $("#uploadimage").submit(); adding after reader.readAsDataURL(this.files[0]); and this also does not help.

这里还有一个实际的例子: http://kod.djpw.cz/vpvb

Yet the live example here: http://kod.djpw.cz/vpvb

从控制台获取代码.如果我编辑此功能:

Yet a code from console. If I edit this function:

  function imageIsLoaded(e) {
    $("#file").css("color","green");
    console.log($("#file"));
    $('#image_preview').css("display", "block");
    console.log($('#image_preview'));
    $('#previewing').attr('src', e.target.result);
    console.log($('#previewing'));
    $('#previewing').attr('width', '250px');
    $('#previewing').attr('height', '230px');
  };

我看到了:

Object { 0: <input#file>, length: 1, context: HTMLDocument → index.html, selector: "#file" } script.js:45
Object { 0: <div#image_preview>, length: 1, context: HTMLDocument → index.html, selector: "#image_preview" } script.js:47
Object { 0: <img#previewing>, length: 1, context: HTMLDocument → index.html, selector: "#previewing" } script.js:49

推荐答案

我全神贯注于解决JS，但没有意识到上传必须由ajax_php_file.php固定在服务器端.当我在代码中进行挖掘时，会看到

I was occupied by solving the JS and did not realized the uploading must be fixed on server side by ajax_php_file.php. When I dig in the code I see line

if (file_exists("upload/" . $_FILES["file"]["name"])) {
  echo $_FILES["file"]["name"] . " <span id='invalid'><b>already exists.</b></span> ";

所以这意味着我需要在与php脚本位置相同的文件夹中创建"upload"文件夹.这是一个简单的修复程序，但不在原始代码描述中.

so this means I need to create the "upload" folder in the same folder as the php script location. This was a simple fix but it was not in the original code description.

这篇关于为什么Jquery图片上传器不上传图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！