Jquery Ajax 上传有进度正在重新加载页面

Question

我有一个奇怪的东西，有一个 Jquery 表单提交。

上传完成后，页面正在重新加载，即使服务器尚未完成处理。

服务器只是return一个json成功状态，所以它不在服务器端。

这是代码：

$form.on('submit', function (e) {

        console.log('Submit form ' + fileNumber);
        if ($form.hasClass('is-uploading')) return false;

        $form.addClass('is-uploading').removeClass('is-error');

        if (isAdvancedUpload) {
            e.preventDefault();
            e.stopPropagation();
            var ajaxData = new FormData($form.get(0));

            var $input = $form.find('input[type="file"]');


            if (fileToUpload) { ajaxData.append($input.attr('name'), fileToUpload); }
            console.log('FileTo Upload: ' + fileToUpload);

            $.ajax({
                url: $form.attr('action'),
                type: $form.attr('method'),
                data: ajaxData,
                dataType: 'json',
                xhr: function () {
                    var myXhr = $.ajaxSettings.xhr();
                    if (myXhr.upload) {
                        myXhr.upload.addEventListener('progress', progress, false);
                    }
                    return myXhr;
                },
                cache: false,
                contentType: false,
                processData: false,
                beforeSend: function (xhr,settings) {

                },
                complete: function (xhr, status) {
                    xhr.
                    //$form.removeClass('is-uploading');
                    //fileNumber++;
                    //fileToUpload = droppedFiles[fileNumber];
                    //if (fileToUpload) { $form.submit(); }
                },
                success: function (data,status,xhr) {
                    //$form.addClass(data.success === true ? 'is-success' : 'is-error');
                    //if (!data.success) $errorMsg.text(data.error);
                },
                error: function (xhr,status,error) {
                }
            });

        } else {
            // ajax for legacy browsers
        }
    });

问题在这里：

   xhr: function () {
                    var myXhr = $.ajaxSettings.xhr();
                    if (myXhr.upload) {
                        myXhr.upload.addEventListener('progress', progress, false);
                    }
                    return myXhr;

如果我删除return myXhr 上传后页面没有重新加载，但我没有进度报告。

我不知道如何防止重新加载。

谢谢。

Answer 1

尝试更改按钮类型提交到按钮并实现点击功能

例如：

$( "#buttonID" ).click(function() {
  //your code
});

Answer 2

我发现了问题。

xhr 对象不用担心。

问题来自 Visual Studio 浏览器 Link。

关闭后一切正常。

浏览器 link，出于明显的原因重新加载页面。

将与 ASP.NET 核心团队会面

Jquery Ajax 上传有进度正在重新加载页面

Jquery Ajax Upload with progress is reloading page

javascript

ajax

jquery

xmlhttprequest

jqxhr