jquery ajax，通过ajax上传图片答案

【问题标题】：Jquery ajax, upload image through ajaxjquery ajax，通过ajax上传图片
【发布时间】：2012-01-06 10:24:36
【问题描述】：

我正在使用这个插件上传图片http://www.finalwebsites.com/demos/php_ajax_upload_example.php

但这不起作用。我收到一个错误，但它立即在 firebug 中消失了

我怎样才能让它工作？任何人都可以显示在 jsfiddle 中工作的插件吗？

提前致谢！！

【问题讨论】：

你先提供一个 jsfiddle 和你的非工作脚本，这样我们就可以看到它有什么问题并修复它？
告诉我们你是如何使用插件的
如果没有错误，甚至没有任何代码，这几乎是无法诊断的。插件链接上有示例代码 - 你的匹配吗？
@Michael Swan：我如何将文件上传到 jsfiddle？
@user1115921，您不会将文件上传到 jsfiddle。你编写脚本、标记和样式。您可以查看帮助部分：doc.jsfiddle.net 了解更多信息。

标签： jquery ajax

【解决方案1】：

我不知道那个插件或如何通过 ajax 上传文件，但这是我在谷歌搜索后完成类似事情的方式。

1) 在页面某处放置一个 div

<div id="iframeholder" style="height:0px;width:0px;display:none;"></div>

2) 这是一些处理上传的 jQuery。它将 iframe 附加到 div 并将其设置为表单提交的目标。然后，您可以阅读 iframe 的内容以查看上传的结果。

  thefile = $('#myfileinput').val();
  iframe = $( '<iframe name="theiframe" id="theiframe"></iframe>' );
  $('#iframeholder').append(iframe);
  $('#theuploadform').attr("action","save.php");
  $('#theuploadform').attr("method","post");
  $('#theuploadform').attr("thefile",thefile);
  $('#theuploadform').attr("enctype","multipart/form-data");
  $('#theuploadform').attr("encoding","multipart/form-data");
  $('#theuploadform').attr("target","theiframe");
  $('#theuploadform').submit(); 
  $("#theiframe").load(function() {
    iframeContents = $('#theiframe').contents().find('body').html();
    $('#theiframe').remove();
  }

3) 这不是我最自豪的时刻，但是当用户在输入字段上按下 Enter 键时，您需要防止表单提交给自身，您可以通过检查按下的键是否为 Enter 键然后聚焦其他一些控件来实现。在此处根据您的需求制作您的选择器。

  $('input[type=text]').bind("keypress", function(thekey) {
    if(thekey.which == "13") { $('#someothercontrol').focus();return false; } 
  });

【讨论】：