我正在使用 jQuery UI dialog modal form .
一切正常,但我发送了一个 ajax 帖子,所以我添加了这段代码:
$( "#dialog-form" ).dialog({
autoOpen: false,
height: 500,
width: 550,
modal: true,
buttons: {
"Create an account": function() {
var bValid = true;
allFields.removeClass( "ui-state-error" );
// From jquery.validate.js (by joern), contributed by Scott Gonzalez: http://projects.scottsplayground.com/email_address_validation/
if ( bValid ) {
$.ajax({ url: 'about.php',
data: {name: name.val(), email: email.val()},
type: 'post',
async: false
});
}
}
}
});
$.ajax
部分是我添加的。
我想在处理帖子时显示加载栏,我添加了这段代码:
$('#progress')
.hide() // hide it initially
.ajaxStart(function() {
$(this).show();
})
.ajaxStop(function() {
$(this).hide();
});
但它不起作用,我的帖子转到一个 php 脚本,其中一个有 2 秒的等待时间。
它只是不显示 #progress div
,所以 .hide
正在工作。
此外,例如,如果我在 $.ajax
之前添加 $( "#dialog-form").dialog({ hide: "slide"});
它不起作用,它会在所有按钮功能完成后隐藏。
谢谢。
最佳答案
如果你的 #progress div
只在这个 ajax 调用期间显示,你为什么不把 show
/hide
Action 放在你的按钮 Action ?
像这样:
$( "#dialog-form" ).dialog({
autoOpen: false,
height: 500,
width: 550,
modal: true,
buttons: {
"Create an account": function() {
var bValid = true;
allFields.removeClass( "ui-state-error" );
if ( bValid ) {
// show before ajax call
$('#progress').show();
$.ajax({ url: 'about.php',
data: {name: name.val(), email: email.val()},
type: 'post',
async: true,
complete: function() {
//hide on complete
$('#progress').hide();
}
});
}
}
}
});
希望这会有所帮助。
关于javascript - 提交 jquery ajax 帖子时加载栏,不显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12707502/