JQuery blockUI ne fonctionne que si je montre une alerte en premier

Question

J'ai des problèmes pour faire fonctionner JQuery blockUI. J'utilise ce code:

$.blockUI({ 
    message : null, 
    overlayCSS : { 
     backgroundColor : '#000000;', 
     opacity : .4 
    } 
}); 

Si je viens d'appeler ce qui précède et appelle la fonction de sommeil ci-dessous je reçois le comportement suivant: Rien ne se passe pendant 5 secondes Le bloc clignote

var start = new Date().getTime(); 
for (var i = 0; i < 1e7; i++) { 
    if ((new Date().getTime() - start) > 5000) { 
     break; 
    } 
} 

Si je lance ce code:

alert("foo"); 
$.blockUI({ 
    message : null, 
    overlayCSS : { 
     backgroundColor : '#000000;', 
     opacity : .4 
    } 
}); 
var start = new Date().getTime(); 
for (var i = 0; i < 1e7; i++) { 
    if ((new Date().getTime() - start) > 5000) { 
     break; 
    } 
} 
alert("bar"); 

Je reçois le comportement suivant:

• L'alerte et le bloc apparaissent (je peux attendre indéfiniment avant d'effacer l'alerte)

• Quand j'effacer le rien bouton d'alerte se produit pendant 5 secondes

• Les commutateurs d'alerte à la « bar «message

• l'alerte et le bloqueur clair quand je rejette l'alerte

Answer 1

J'ai fini par déplacer la partie "sommeil" de l'interaction vers le serveur et utilisé quelque chose comme ça sur le client:

<header> 
    <script language="javascript"> 
     function blockExample() { 
      // block the ui 
      $.blockUI({ 
       message : null, 
       overlayCSS : { 
        backgroundColor : '#00f' 
       } 
      }); 
      // do the ajax call 
      $.ajax({ 
       url : "${home}/action/wait/WaitAction?howLong=5000", 
       type : "get", 
       success : function(data) { 
        $.unblockUI(); 
       }, 
       error : function() { 
        alert("error"); 
       } 
      }); 
     } 
    </script> 
</header> 

<div align="center"> 
    <a href="javascript:blockExample()">Click me to block this page for 5 seconds</a> 
</div>