ajax刷新后没有触发的blueimp / jQuery-File-Upload进度事件

时间:2016-03-14 12:58:20

标签: javascript jquery ajax blueimp

我尝试在我的网站上放置这个jquery插件:blueimp / jQuery-File-Upload 一切都很好。上传,恢复,取消,块,......

除了一件事。

我的网站上有一个ajax导航,在更改视图的ajax调用后,进度条没有更新

我可以在Web开发人员视图中看到上传继续有效,但更改页面后没有任何关于进度事件。

你能帮助我吗?

这是我的代码:

ajax导航的一部分:

$(document).on('click', 'a[data-ajax=true]', function(){
    var URL = $(this).attr('href');
    $.ajax({
        type:'GET',
        url: URL,
        async: true,
        success: function(response) {
            $('#content-container').html(response);
            $('pre code').each(function(i, block) {
                hljs.highlightBlock(block);
            });
        },
        error: function(response){
            console.log(response);
            }});
    return false;
});

Fileupload Blueimp部分:

$('.fileupload').fileupload({
        dropZone: $('.dropzone'),
        url: url,
        dataType: 'json',
        maxFileSize: 10000000000,
        maxChunkSize: 5000000
    });
    $(document).bind('fileuploadadd', '.fileupload', function (e, data) {
        var random = Math.floor(Math.random() * 1000000000);
        data.context = $('<li data-unique="'+random+'" ></li> ').appendTo('#files');
        $.each(data.files, function (index, file) {
            file.uploadID = random ;
            var close = $('<a href="#" class="item"/>').appendTo(data.context);
            var div = $('<div class="clearfix"/>').appendTo(close);
            var node = div
                .append($('<p/>').addClass('pull-left').text(file.name))
                .append($('<p/>').addClass('pull-right').text('0%'));

            $('<div class="progress progress-sm">' +
                '<div style="width: 0%;" class="progress-bar">' +
                '<span class="sr-only">0% Complete</span>' +
                '</div>' +
                '</div>').appendTo(close);
        });
    }).bind('fileuploadsubmit', '.fileupload', function (e, data) {
        data.formData = {
            ...
        };
    }).bind('fileuploadprogress', '.fileupload', function (e, data) {
console.log('progress fired')
        var progress = parseInt(data.loaded / data.total * 100, 10);
        $('li[data-unique='+data.files[0].uploadID+'] .progress-bar').css('width',progress + '%');
        $('li[data-unique='+data.files[0].uploadID+'] .pull-right').text(progress +'%');
        $('li[data-unique='+data.files[0].uploadID+'] .sr-only').text(progress +'% Complete');
    })
[...]

0 个答案:

没有答案