小编acm*_*ail的帖子

如何取消/中止 jQuery AJAX 文件上传

我正在使用 Ajax 文件上传功能和模式中的状态栏。该代码运行良好。但是,当用户单击取消按钮(上传时)时,模式关闭,但文件正在后台上传到服务器。

我尝试了xhr.abort();取消上传的功能。但这不起作用。如何在用户单击取消按钮时停止文件上传过程。

我正在使用jquery 1.10.2版本。

$(function () {
        $('#showonlyvalue-portvid').hide();
        $('#btnuploadvideo').click(function () {
            if (jQuery("#verifyvideo-file").valid()) {
                $('.myprogress').css('width', '0');
                $('.successmsgfile-video').text('');
                var formData = new FormData();
                formData.append('portfoliovideos', $('input[name=portfoliovideos]')[0].files[0]);
                $('#showonlyvalue-portvid').show();
                $('#btnuploadvideo').attr('disabled', 'disabled');
                $('.successmsgfile-video').text('Uploading in progress...');
                $.ajax({
                    url: "<?php echo base_url(); ?>profile/port_videoone"
                    , data: formData
                    , processData: false
                    , contentType: false
                    , type: 'POST' // this part is progress bar
                    , xhr: function () {
                        var xhr = new window.XMLHttpRequest();
                        xhr.upload.addEventListener("progress", function (evt) {
                            if (evt.lengthComputable) {
                                var percentComplete = …
Run Code Online (Sandbox Code Playgroud)

javascript ajax jquery file-upload jquery-file-upload

2
推荐指数
1
解决办法
5614
查看次数