JQuery UI对话框显示等待消息，直到处理ajax调用

我认为一切都在标题中。 当我开始这个时，我认为这将是一个5分钟的代码或谷歌搜索时的快速结果…但现在是三个小时我在这：

只需显示一个对话框，其中包含“Please Wait …”消息，而我正在执行ajax调用以检索一些json结果，然后显示“结果完成”。

$('#switchOff').live("click",function(){ $('#dialog').dialog({ modal:true, open: function(){ // I would like to call myAjax function //From here ? // While my dialog is showing the Wait message... }, complete: function(){ //close the dialog when fished $('#dialog').dialog('close'); }, }); }); function ajaxCall() { //my ajax call } 

Answer 1

你不应该再使用live了。 请改用.on 。 您正在混合对话框ajax代码。 这是我将如何做的一个例子。

这里是演示小提琴的链接

 $('#switchOff').on("click", ajaxCall); $("#loading").dialog({ hide: 'slide', show: 'slide', autoOpen: false }); function ajaxCall() { $.ajax({ url: '/echo/html/', data: { html: '
JSON result
' , delay: 3}, method: 'post', beforeSend: function(){ $("#loading").dialog('open').html("
Please Wait...
"); }, success: function(data) { $('#loading').html("
Result Complete...
"); $('#ajaxResult').html(data); } }); } 

Answer 2

好

有了这个评论

  `As I described my problem, in fact I would like to first display the dialog: $("#myDialogBox").dialog();` And after call the ajax.. 

解决方案是：

点击按钮id="btn"

 $( "#btn_Deletepara" ).click(function() { $( "#JQUERY'sDialog" ).dialog( "open" ); //Now you Call the ajax }); 

要么

 $( "#JQUERY'sDialog" ).dialog({ Add your script for call ajax