通过ajax上传图像时遇到问题

Question

抱歉，标题不够描述！

这个想法是要有一个div弹出框，并允许用户输入他们的反馈并可能提交屏幕截图。

这是页面内的javascript（通过ajax调用到div中）。

Java脚本

$("#submitFeedback").click(function(){
  //Check if the form is valid
  if($("#form").valid()){
    $("#form").hide(); //Hide the form
    $("#feedbackReport").append("<h2 style='color:white'>Submitting!</h2><hr />" +
      "<div style='text-align: center'><img src='images/loader.gif' /></div>");//Display loading spinner
    $.ajax({  
      type: "POST",  
      url: "ajax/submit_feedback.php",
      cache: false,
      data: $("#form").serialize(),//serialize form for submission
      success: function(data) {
        $("#feedbackReport").empty();//Clear form after submission
        $("#feedbackReport").append("<h2>Thank you!</h2><span id='close'>&#10006;</span><hr />"
          +"Your feedback has been submitted successfully!"
          +"<br /><br /><span id='cancel'>Close</span>");
        $("#cancel,#close").click(function(){
          $("#feedbackReport").parent().hide();
        });
      }
    });
    return false;//Prevent page from changing
  }
});

现在，如果将我的浏览器指向实际的ajax页面（ajax / feedback.php）并提交图像，则可以正常工作！ 当我从index.php运行它并通过ajax调用反馈窗口时，它不会提交我的图片，仅提交文本。

我知道我的Submit_feedback.php页面可以正常运行，因此，我根本不知道为什么它无法正确发布图像。

任何提示或帮助将不胜感激！

Answer 1

Ajax无法上传文件。 您必须使用其他内容，例如https://github.com/valums/file-uploader

Answer 2

Ajax不允许上传文件，但是一个巧妙的窍门是使用保存文件上传表单的iframe，并在选择文件后自动提交。

这样，只有iframe会被重定向，并给人以ajax的感觉。

在这里阅读更多