In Warteschlangen und stoppen Sie die Weitergabe eines Klickereignisses innerhalb eines div in Javascript

Question

Ich versuche, eine "warten Sie 3 Sekunden, um diese Operation" <div> zu implementieren.

Also, ich habe eine <div>, die eine Reihe von Elementen enthält, die ich für etwa 3 Sekunden (ein Timer oder ein anderes Ereignis) nichtklickbar sein möchte, aber irgendwie die Ereignisse in einer Warteschlange erfassen und dann feuern sie nach dem Zeitraum (oder ein Ereignis meiner Wahl) ist abgelaufen/durchgeführt?

Ich denke, das ist ein Problem, wie das Aufstellen eines modalen Dialogs, und dann nichts darunter klickbar haben. Habe ich recht, wenn ich das denke?

Gedanken/Ideen?

Answer 1

Geben Sie die div-onclick-Funktion, die für die ersten 3 Sekunden als nur hält ein Array von Aufrufen mit ihren Ereignissen beginnt ... dann nach der 3000 Millisekunden-Timer ist, führen Sie eine Funktion, die div Onclick ändert, ermöglicht die Bearbeitung von Dingen und führt das Array von Ereignissen aus.

Answer 2

Eine andere Sache, die ich hilfreich gefunden habe, ist die Funktion.

setTimeout("alert('hello')",1250); 

So etwas entlang der Linien von allen Elementen Onclick Verfahren mit einem zweiten Verfahren umgibt, der so lange diesen Anruf gespeichert werden, wie Sie benötigen.

<div onclick=registerClick("normallyDoThis()")></div> 

Dann können Sie sich am Anfang der Zeit, ein Timer-Setup, um die Div zu ändern und alle Befehle ausführen. Möglicherweise mit dem eval Befehl?

setTimeout("changeTheDiv()", 3000); 

function changeTheDiv() 
{ 
/*eval() all the items in a list of onclicks youve been storing up */ 
/*Then go through and parse out the register() from all the onclick methods*/ 
} 

Ich hoffe, das hilft

Answer 3

Eine Möglichkeit ist die Click-Handler für Ihre DIV reagieren haben auf die untergeordneten Elemente klickt wie das Ereignis sprudelt. Dieser Handler würde die Warteschlange so lange ausführen, bis die Verzögerung abgelaufen ist. Hier ist ein grobes Beispiel (Verwendung der jQuery-Ereignisbehandlung zur Vereinfachung):

(function() { 
    var isReady = false, queue = []; 

    setTimeout(function() { 
     isReady = true; 
     processQueue() 
    }, 3000); 

    $("#mainDiv").click(function(ev) { 
     if (isReady) { 
      //code to handle the click based on which child was clicked (ev.srcElement) 
     } else { 
      queue.push(ev.srcElement); 
     } 
    }); 

    function processQueue() { 
     var i, elem; 
     for (i = 0; elem = queue[i]; i++) { 
      $(elem).click(); //re-trigger the click event 
     } 
     queue.length = 0; 
    } 
})();