遅延jqueryのUIダイアログクローズコールバックが

Question

を終了した後、私はそうのようにjQuery UIのダイアログを使用して確認ボックスを呼び出す時まで：

function tps_show_confirm(cTitle, cContent, noClose = true, dwidth = 300, callback=null) { 
    if (noClose == true) { 
     var dClass = 'no-close'; 
    } else { 
     var dClass = ''; 
    } 
    var confirmDiv = '<div class="tps-confirm-modal">'+cContent+'</div>'; 
    var maxHeight = window.innerHeight * .80; 
    $(confirmDiv).dialog({ 
     title: cTitle, 
     dialogClass: dClass, 
     modal: true, 
     width: dwidth, 
     maxHeight: maxHeight, 
     draggable: false, 
     resizable: false, 
     create: function(event, ui) { 
      $('body').css({ overflow: 'hidden' }) 
     }, 
     beforeClose: function(event, ui) { 
      $('body').css({ overflow: 'inherit' }) 
     }, 
     buttons: { 
      Ok: function() { 
       if (typeof callback === 'function') { 
        callback(); 
       } 
       $(this).dialog('close'); 
      }, 
      Cancel: function() { 
       $(this).dialog('close'); 
      } 
     } 
    }); 
} 

私は時にOKボタン.dialog('close')行動を遅らせる方法を把握しようとしていますcallback（）関数が終了するまでクリックされます。私は.done（）や.finish（）と.when（）のさまざまな組み合わせを試しましたが、私はそれらをあまり理解していないので、このようなことはしていないようです。

これを実現する方法はありますか？うまくいけば、

Answer 1

jquery.whenは、このスニペットは便利です

Ok: function() { 
       if (typeof callback === 'function') { 
        $.when(callback()).then(function() { 
         $(this).dialog('close'); 
       }.bind(this)); 
       }else{ 
        $(this).dialog('close'); 
       } 

      } 

有用であろう。私はコールバック関数を呼び出しています。コールバック関数の中に非同期呼び出しがあります。 okボタンをクリックすると、コールバック関数は実行を開始しますが、非同期操作からの応答があるときだけダイアログが閉じます。

function tps_show_confirm(callback = null) { 
 
    var confirmDiv = '<div class="tps-confirm-modal">Hello Test</div>'; 
 
    var maxHeight = window.innerHeight * .80; 
 
    $(confirmDiv).dialog({ 
 
    title: 'test', 
 
    dialogClass: 'dClass', 
 
    modal: true, 
 
    width: 300, 
 
    maxHeight: 300, 
 
    draggable: false, 
 
    resizable: false, 
 
    create: function(event, ui) { 
 
     $('body').css({ 
 
     overflow: 'hidden' 
 
     }) 
 
    }, 
 
    beforeClose: function(event, ui) { 
 
     $('body').css({ 
 
     overflow: 'inherit' 
 
     }) 
 
    }, 
 
    buttons: { 
 
     Ok: function() { 
 
     if (typeof callback === 'function') { 
 
      $.when(callback()).then(function(data) { 
 
      console.log(data) 
 
      $(this).dialog('close'); 
 
      }.bind(this)); 
 
     } else { 
 
      $(this).dialog('close'); 
 
     } 
 

 
     }, 
 
     Cancel: function() { 
 
     $(this).dialog('close'); 
 
     } 
 
    } 
 
    }); 
 
} 
 

 
function test() { 
 
    var root = 'https://jsonplaceholder.typicode.com'; 
 

 
    return $.ajax({ 
 
    url: root + '/posts/1', 
 
    method: 'GET' 
 
    }).then(function(data) { 
 
    return data; 
 
    }); 
 

 
} 
 
tps_show_confirm(test)

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css"> 
 
<script src="//code.jquery.com/jquery-1.12.4.js"></script> 
 
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>