Javascript jQuery文件上传完成功能

我修改了jQuery File Upload's My scripting works中提供的用于

add

回调的示例代码，但没有修改

done

回调的示例代码。服务器正确获取帖子并返回JSON响应

我注意到在源代码中有些回调被注释掉了。我不确定是否应该取消注释它们。或者使用回调

fileuploaddone

，但删除注释无效

不确定我做的是否正确。我希望服务器返回一个JSON对象，描述我刚刚上传的图像，这样我表单的下一步就可以将图像与backbone.js模型链接起来

<form id="uploadform">
    <input id="fileupload" type="file" name="imagefile" data-url="imagefiles" multiple>
    <button type="#" class="btn btn-primary uploadfile" style="display: none">Upload</button>
    <div id="progress">
        <div class="bar" style="width: 0%;"></div>
    </div>      
</form>
<script>
$(function () {
    $('#fileupload').fileupload({
        dataType: 'json',
        done: function (e, data) {              
        data.context = $('.uploadfile').css('display','none')
            utils.addValidationSuccess('Added file: ' + data.jqXHR.name);
        },
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);
            $('#progress .bar').css(
                'width',
                progress + '%'
            );
        },
        add: function (e, data) {
            console.log('added');
            data.context = $('.uploadfile')
                .css('display','block')
                .click(function () {
                    utils.showAlert('Uploading','...', 'alert-warning');
                    data.submit();
                });
        }
    });
});
</script>

上传
$（函数（）{
$（'#fileupload'）。fileupload({
数据类型：“json”，
完成：函数（e，数据）{
data.context=$（'.uploadfile'）.css（'display'，'none'））
utils.addValidationSuccess（'添加的文件：'+data.jqXHR.name）；
},
progressall：功能（e、数据）{
var progress=parseInt（data.loaded/data.total*100,10）；
$（'#progress.bar'）.css(
“宽度”，
进度+“%”
);
},
添加：功能（e、数据）{
console.log（'added'）；
data.context=$（'.uploadfile'）
.css（'显示'，'块'）
。单击（函数（）{
utils.showAlert（'Uploading'，'…'，'alert warning'）；
data.submit（）；
});
}
});
});

让事情运转起来的是在提交时使用jquery.ajax显然是本机的回调，调整后的代码如下所示

<div class="row-fluid">
    <form id="uploadform">
        <input id="fileupload" type="file" name="imagefile" data-url="imagefiles" multiple>
        <button type="#" class="btn btn-primary uploadfile" style="display: none">Upload</button>
        <div id="progress">
            <div class="bar" style="width: 0%;"></div>
        </div>      
    </form>
    <script>
    $(function () {
        $('#fileupload').fileupload({
            dataType: 'json',
            progressall: function (e, data) {
                var progress = parseInt(data.loaded / data.total * 100, 10);
                $('#progress .bar').css(
                    'width',
                    progress + '%'
                );
            },
            add: function (e, data) {
                console.log('added');
                data.context = $('.uploadfile')
                    .css('display','block')
                    .click(function () {
                        utils.showAlert('Uploading','...', 'alert-warning');
                        var jqXHR = data.submit()
                            .success(function (result, textStatus, jqXHR) {
                                console.log('Done');

                                console.log('e:' + e);
                                console.log('results:' + result );
                                console.log('results.id:' + result.id );
                                console.log('textStatus:' + textStatus );               
                                console.log('jqXHR:' + jqXHR );

                                data.context = $('.uploadfile').css('display','none')
                                utils.showAlert('Success','the file uploaded successfully','alert-success');
                                // utils.addValidationSuccess('Added file: ' + data.jqXHR.name);
                            })
                            .error(function (jqXHR, textStatus, errorThrown){
                                 utils.showAlert('Error','...', 'alert-error');
                            });
                    });
            }
        });
    });
    </script>
</div>

上传
$（函数（）{
$（'#fileupload'）。fileupload({
数据类型：“json”，
progressall：功能（e、数据）{
var progress=parseInt（data.loaded/data.total*100,10）；
$（'#progress.bar'）.css(
“宽度”，
进度+“%”
);
},
添加：功能（e、数据）{
console.log（'added'）；
data.context=$（'.uploadfile'）
.css（'显示'，'块'）
。单击（函数（）{
utils.showAlert（'Uploading'，'…'，'alert warning'）；
var jqXHR=data.submit（）
.success（函数（结果、文本状态、jqXHR）{
console.log（'Done'）；
console.log（'e:'+e）；
console.log（'results:'+result）；
console.log（'results.id:'+result.id'）；
console.log（'textStatus:'+textStatus）；
log（'jqXHR:'+jqXHR）；
data.context=$（'.uploadfile'）.css（'display'，'none'））
utils.showarter（'Success'，'the file upload successfully'，'alert-Success'）；
//utils.addValidationSuccess（'添加的文件：'+data.jqXHR.name）；
})
.error（函数（jqXHR、textStatus、errorshown）{
utils.showAlert（'Error'，'…'，'alert Error'）；
});
});
}
});
});

我对这段代码也有同样的问题

$(function () {
    $('#fileupload').fileupload({
        dataType: 'json',
        done: function (e, data) {
              alert("done");
        }     
    });
});

只需不设置数据类型，就可以执行done回调。。。 下面的代码只是工作

$(function () {
    $('#fileupload').fileupload({
            done: function (e, data) {
                  alert("done");
        }     
    });
});

---

服务器返回一些json。

如果您能告诉我们更多关于您遇到的错误、消息或其他方面的信息，而不是仅仅说“它不工作”，可能会有所帮助。）您的服务器是否返回json对象，或者您是否询问如何执行此操作？从未调用done回调。根据我的控制台，没有发生javascript错误。服务器确实返回了一个JSON对象，描述了它接收到的图像。