JavaScript事件處理程序的執行順序

有了這個JS代碼：JavaScript事件處理程序的執行順序

document.getElementById('e1').addEventListener('click', function(){alert('1');}, false); 
document.getElementById('e2').addEventListener('click', function(){alert('2');}, false); 
document.getElementById('e1').click(); 
document.getElementById('e2').click();

我想知道在將警報顯示什麼樣的順序 - 它會在事件被觸發click()的順序或可能是隨機的？

我在詢問文檔化/標準化的行爲，而不是關於瀏覽器目前實現的功能。

來源

2011-08-16 Marek Sapota

'點擊（）;'將無法正常工作，順便;那不是發射事件的方式。你需要使用'createEvent'，'initEvent'和'dispatchEvent'。 –

不，我不知道。 http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-2651361 –

在這種情況下，沒關係，但是這種射擊事件的方法遠遠不是普遍的，所有元素上的事件。發射事件的唯一可靠方法是使用上面提到的三種方法。 –

警報將按順序執行 - 1，然後2。這是因爲click事件是同步的（請參閱here） - 當發出.click()時，處理程序將立即運行（請參閱最後一段here）。所以這個代碼：

document.getElementById('e1').addEventListener('click', function(){alert('1');}, false); 
document.getElementById('e2').addEventListener('click', function(){alert('2');}, false); 
document.getElementById('e1').click(); 
document.getElementById('e2').click(); 
alert('3');

會產生相同的結果

alert('1'); 
alert('2'); 
alert('3');

來源

2011-08-16 20:10:53

http://www.w3.org/TR/DOM-Level-3-Events/#sync-async +50如承諾 –

-1

我會1，然後2。 http://jsfiddle.net/kkYfX/

來源

2011-08-16 11:07:03

不確定在點擊e1之前e2點擊如何觸發警報？ –

由於事件處理程序在執行'click（）'時不會立即運行。之後他們會跑「一段時間」 - 可能會有不同的順序。 –

@maarons - 第二個必須在第一個之後調用。唯一的弱點可能是，如果在第二條語句調用第一條語句之前，第一條語句的冒泡會導致另一個語句被調用。但在這種情況下，它將被調用兩次，並且始終在第一次之後。如果偵聽器被設置爲在捕獲階段觸發，事情可能會不同，但這不是代碼正在做的事情。 – RobG

JavaScript事件處理程序的執行順序

回答

相關問題