为什么不执行ajax请求?
社区首页 >问答首页 >为什么不执行ajax请求?问为什么不执行ajax请求?ENStack Overflow用户提问于 2019-06-16 00:14:03回答 1查看 2.9K关注 0票数 1解释一下这里出了什么问题。首先,必须执行run函数及其ajax请求。但由于某种原因,函数被执行,而ajax请求没有执行。它就在脚本的最末端运行-在所有这些功能之后.为什么会发生这种事,以及如何解决?
代码语言:javascript复制
var files = [];
$('.product_images_button').click(function() {
$('.product_images').click();
});
$('.product_images').change(function() {
handleFiles(this);
});
$('.media_preview_wrap').on('click', '.thumb', function() {
removeFile($(this).data('id'));
});
$('#id_submit').click(function() {
event.preventDefault();
var $form = $('form'),
formdata = new FormData($form[0]),
$button = $('#id_submit');
formdata.append('content', CKEDITOR.instances.id_content.getData());
function run() {
var product_id = null;
$.ajax($form.attr('action'),{
type: 'POST',
data: formdata,
processData: false,
contentType: false,
success: function(data) {
product_id = data.product_id;
}, error: function(error) {
console.log(error)
}
});
return product_id}
product_id = run();
files.forEach(function(file, index) {
var data = new FormData();
data.append('name', file.name);
data.append('gallery_image', file.file);
uploadFile(event.target.action, data)
.done(function(response) {
removeFile(file.id);
})
.fail(function(error) {
console.log(error);
});
});
});
function handleFiles(input) {
var URL = window.URL || window.webkitURL;
var uniqueId = (new Date()).getTime()
for (var i = 0; i < input.files.length; i++) {
var file = input.files[i];
if (file && file.type.startsWith('image/')) {
uniqueId++;
files.push({
id: uniqueId,
file: file,
name: file.name // задел для возможности переименования файла.
});
var img = $('');
$('.media_preview_wrap').append(img);
img.on('load', function() {
URL.revokeObjectURL(this.src);
});
}
}
$(input).val('');
}
function removeFile(id) {
files = files.filter(function(file) {
return id !== file.id;
})
$('img[data-id="'+ id +'"]').remove();
}
function uploadFile(url, data) {
return $.ajax({
headers: {'X-CSRFToken': '{{ csrf_token }}' },
type: 'POST',
url: url,
data: data,
processData: false,
contentType: false,
cache: false
});
}
.thumb {
width: 150px;
height: auto;
opacity: 0.9;
cursor: pointer;
}
.thumb:hover {
opacity: 1;
}
.product_images {
display: none;
}
ajaxrequestjavascriptjquery关注问题分享EN回答 1推荐最新Stack Overflow用户回答已采纳发布于 2019-06-16 00:20:24
最初的问题可能是由于一些浏览器具有全局event对象,而其他浏览器则没有。
您可能会收到event未定义的错误,这将阻止其余的代码运行。
使用事件处理程序函数的参数,该函数总是传入一个事件对象:
代码语言:javascript复制$('#id_submit').click(function(event) {
// ^^^
event.preventDefault();一旦这个问题解决了。您需要认识到$.ajax是异步的,在第一个请求在success回调中完成之前,您不能使用success的新值
请参阅How do I return the response from an asynchronous call?
收藏分享票数 3EN页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持原文链接:https://stackoverflow.com/questions/56615122
复制相关文章
重磅!用 AI 实现车牌识别:YOLO+PaddleOCR 实战项目解析十升油等于多少斤油