Jquery Ajax 上传有进度正在重新加载页面
Jquery Ajax Upload with progress is reloading page
我有一个奇怪的东西,有一个 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 上传后页面没有重新加载,但我没有进度报告。
我不知道如何防止重新加载。
谢谢。
尝试更改按钮类型提交到按钮并实现点击功能
例如:
$( "#buttonID" ).click(function() {
//your code
});
我发现了问题。
xhr 对象不用担心。
问题来自 Visual Studio 浏览器 Link。
关闭后一切正常。
浏览器 link,出于明显的原因重新加载页面。
将与 ASP.NET 核心团队会面
我有一个奇怪的东西,有一个 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 上传后页面没有重新加载,但我没有进度报告。
我不知道如何防止重新加载。
谢谢。
尝试更改按钮类型提交到按钮并实现点击功能
例如:
$( "#buttonID" ).click(function() {
//your code
});
我发现了问题。
xhr 对象不用担心。
问题来自 Visual Studio 浏览器 Link。
关闭后一切正常。
浏览器 link,出于明显的原因重新加载页面。
将与 ASP.NET 核心团队会面