有没有人有一个关于如何使用jquery表单上传的好例子/教程?

测试后 AjaxFileUpload Plugin 我发现它不让我找回 $_POST 数据,因为插件只提交 $_FILE 数据。因此,我转向jquery表单插件,它记录在这里: http://www.malsup.com/jquery/form/#file-upload

不幸的是,我觉得这个例子很糟糕,对我没有帮助。我需要使用iframe来防止页面重新加载。

有人使用jquery表单插件使用iframe上传文件时,有没有工作代码og链接到god教程?

我知道还有其他文件上传插件,但我想使用这个项目。

更新
这是我目前使用的代码。它所做的只是重新连接页面,我没有得到输出/警报。

HTML

<form id="uploadForm" enctype="multipart/form-data" action=""  method="POST">
    <input type="hidden" name="MAX_FILE_SIZE" value="1000000" />
    <input type="hidden" id="current_path" name="current_path" value="<?php echo $fb->relative_url; ?>" />
    <input id="uploadFile" name="uploadFile" type="file" />
    <input type="submit" class="button uploadImage" value="<?php _e('Upload File') ?>" /> <br /> 
</form>

javascript

var options = {
    beforeSubmit:   function() { alert('before');},
    success:        function(html) { alert('success + ' + html);},
    data:           {current_path: jQuery('#currentPath span').html()},
    url:            '../wp-content/plugins/wp-filebrowser/uploader.php',
    iframe:         true,
    dataType:       'html'
};

jQuery('#uploadForm').submit(function() {
    jQuery(this).ajaxSubmit(options);
    return false;
});

我也试过这个JS

jQuery('#uploadForm').ajaxForm({
    beforeSubmit:   function() { alert('before');},
    success:        function(html) { alert('success + ' + html);},
    data:           {current_path: jQuery('#currentPath span').html()},
    url:            '../wp-content/plugins/wp-filebrowser/uploader.php',
    dataType:       'html'
});

但我的页面仍然只会重新加载,不会触发警报:(

调试

在我的JS文件中运行以下脚本: alert(jQuery('#uploadForm').ajaxForm); 给了我这个输出:

function (options) {
    if (this.length === 0) {
        var o = {s: this.selector, c: this.context};
        if (!jQuery.isReady && o.s) {
            log("DOM not ready, queuing ajaxForm");
            jQuery(function () {jQuery(o.s, o.c).ajaxForm(options);});
            return this;
        }
        log("terminating; zero elements found by selector" + (jQuery.isReady ? "" : " (DOM not ready)"));
        return this;
    }
    return this.ajaxFormUnbind().bind("submit.form-plugin", function (e) {if (!e.isDefaultPrevented()) {e.preventDefault();
jQuery(this).ajaxSubmit(options);}}).bind("click.form-plugin", function (e) {var target = e.target;
var jQueryel = jQuery(target);
if (!jQueryel.is(":submit,input:image")) {var t = jQueryel.closest(":submit");
if (t.length == 0) {return;}target = t[0];}var form = this;
form.clk = target;
if (target.type == "image") {if (e.offsetX != undefined) {form.clk_x = e.offsetX;
form.clk_y = e.offsetY;} else if (typeof jQuery.fn.offset == "function") {var offset = jQueryel.offset();
form.clk_x = e.pageX - offset.left;
form.clk_y = e.pageY - offset.top;} else {form.clk_x = e.pageX - target.offsetLeft;form.clk_y = e.pageY - target.offsetTop;}}setTimeout(function () {form.clk = form.clk_x = form.clk_y = null;}, 100);});
}

从调试来看,当我运行此脚本时,表单似乎没有完成加载。这很奇怪,因为我在里面 jQuery(document).ready() .