" AJAX"上传问题与jQuery [英] "AJAX" Upload Issues with jQuery

查看:124
本文介绍了" AJAX"上传问题与jQuery的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想创建一个简单的AJAX上传(因为我知道你不能真正做一个AJAX上传)。我有问题,我真的不希望使用插件。我正在写一个应用程序,需要有PDF附件的一种形式的一部分,我的应用程序的code已经在1000线JS +的jQuery。我不希望添加的SWFObject的额外1000K或一个巨大的表格插件。另外,我喜欢学习的东西,所以我知道他们是如何工作:)和我在JS相当精通,以及...

I'm trying to create a simple "AJAX" uploader (as i know you can't actually do an AJAX upload). I'm having issues and i REALLY don't want to use a plugin. I'm writing an app that needs to have PDF attachments as part of a form, and my app's code is already at about 1000 lines of JS + jQuery. I don't want to add on an extra 1000k of SWFObject or a giant form plugin. Plus, i like learning things so I know how they work :) and i'm fairly proficient in JS as well...

下面是我到目前为止有:

Here is what I have so far:

<!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>

我继续读书,如果我添加目标ATTR到表格的形式将提交那里,但没有运气可言。它只是不把任何东西在iframe。根据所选内容项中的动作ATTR将是动态的。如果我关闭了所有的AJAX它工作正常过了,我没有访问到后端,因为它是一个内部的API。

I keep reading that if i add the target attr to a form the form will submit there, but no luck at all. It just doesn't put anything in the iframe. The "action" attr will be dynamic based on what item is selected. If i turn off all the "AJAX" it works fine too, and i don't have access to the backend as it's an internal API.

所以,我如何提交这的iframe,然后让iframe的内容,这将是一个JSON响应?

So, how do I submit this to the iframe and then get the iframe's content which will be a JSON response?

P.S。这仅仅是一个测试页面即时通讯工作... OBV这是不是整个应用程序。

P.S. this is just a test page im working in... obv this isn't the entire app.

推荐答案

这不是说的提交表单的的填充&LT; IFRAME&GT; 。该职位应使其恢复到服务器 - 你看到了吗?然后,服务器响应将结束在&LT; IFRAME&GT; 。通常情况下,你才能做,使之感受到排序像Ajax是有响应页面包含一些JavaScript,讨论回主画面不知。

It's not that the submit of the form populates the <iframe>. The POST should make it back to the server - are you seeing that? Then, the server response will end up in the <iframe>. Typically what you do in order to make it feel sort-of like Ajax is to have the response page contain some Javascript that talks back to the main page somehow.

中断返回从您提交处理程序,并看看会发生什么。

Stop returning false from your submit handler and see what happens.

这样做的一点是要避免表单提交的默认行为。当您在普通的旧的HTML的方式提交表单,包含表单的页面被替换为来自服务器的响应。当你的目标的形式以&LT; IFRAME&GT; ,然而,事实并非如此。相反,响应是冲着页的框架内。

The point of doing this is to avoid the default behavior of form submission. When you submit a form in the plain old HTML way, the page containing the form is replaced by the response from the server. When you target the form at an <iframe>, however, it's not. Instead the response is directed at the "page" inside the frame.

这篇关于&QUOT; AJAX&QUOT;上传问题与jQuery的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆