jQuery 的“AJAX”上传问题答案

【问题标题】："AJAX" Upload Issues with jQueryjQuery 的“AJAX”上传问题
【发布时间】：2011-03-22 23:34:18
【问题描述】：

我正在尝试创建一个简单的“AJAX”上传器（我知道您实际上无法进行 AJAX 上传）。我遇到了问题，我真的不想使用插件。我正在编写一个需要将 PDF 附件作为表单的一部分的应用程序，而我的应用程序代码已经在 1000 行左右的 JS + jQuery 中。我不想添加额外的 1000k SWFObject 或巨型表单插件。另外，我喜欢学习东西，所以我知道它们是如何工作的：）而且我也相当精通 JS...

这是我目前所拥有的：

<!DOCTYPE html>
<html>
    <head>
        <title>Upload Test</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
        <script>            
            $(function(){
                $('#file_upload').submit(function(){
                    $('#file_upload').attr('target','upload_target');
                    alert($('iframe').contents().text());
                    return false;

                });
            });
        </script>
    </head>
    <body>
        Upload Test to 382
        <form id="file_upload" method="post" enctype="multipart/form-data" action="io.cfm?action=updateitemfile&item_id=382">
            <input name="binary" id="file" size="27" type="file" /><br />
            <input type="submit" name="action" value="Upload" /><br />
            <iframe id="upload_target" name="upload_target" src="" style=""></iframe>
        </form>

    </body>
</html>

我一直在阅读，如果我将目标属性添加到表单中，表单将在那里提交，但一点运气都没有。它只是没有在 iframe 中放置任何内容。 “动作”属性将根据选择的项目而动态变化。如果我关闭所有“AJAX”，它也可以正常工作，而且我无法访问后端，因为它是一个内部 API。

那么，我如何将它提交到 iframe，然后获取 iframe 的内容，这将是 JSON 响应？

附：这只是我正在工作的一个测试页面... obv 这不是整个应用程序。

【问题讨论】：

标签： javascript jquery html ajax json

【解决方案1】：

并不是表单的提交填充了<iframe>。 POST 应该返回到服务器 - 你看到了吗？然后，服务器响应将以<iframe> 结束。通常，为了让它感觉有点像 Ajax，你要做的就是让响应页面包含一些 Javascript，以某种方式与主页交互。

停止从您的提交处理程序返回false，看看会发生什么。

这样做的目的是避免表单提交的默认行为。当您以普通的旧 HTML 方式提交表单时，包含该表单的页面将替换为来自服务器的响应。但是，当您将表单定位到 <iframe> 时，它不是。相反，响应是针对框架内的“页面”。

【讨论】：

系统提示我下载 io.cfm 文件？
是因为它返回的是原始 JSON 吗？我可以要求服务器人员对此进行更改，但这可能需要一些时间，如果可能的话，我希望得到 JSON 响应。
JSON 响应对你没有任何好处，因为浏览器不知道如何处理它。检查响应中的标头；如果它提供文件供下载，那么让它工作的机会就更小了。
我应该让他们以什么格式给我？ XML 或 HTML 或返回 JSON 然后我的 JS 将其取消字符串化的文本标题呢？
等等 - 这个“io.cfm”网址在哪里？这是一个真实的 URL 还是只是一个文件？在没有某种服务器运行的情况下，即使它只是 CGI，也将在“真正困难”和“不可能”之间进行测试。