等待eventlisteners在調用事件後完成

Question

我看到很多類似的問題，但沒有人真正回答我的問題。我認爲這很簡單，但我想這不是因爲JS是單線程的。

基本上，我想從一個html元素中提取信息，這個html元素通過一個eventlistener插入，等待點擊一個特定的html元素。與jQuery它看起來像這樣：

chrome.runtime.onMessage.addListener(
    function(request, sender, sendBack) { 
     $(".clickme").click(); // Invoke 
     var result = $("#main-text").attr("src"); // Exists only when ".clickme" was clicked 
     sendBack(result); 
}); 

問題與前面的代碼是#main-text不只是被執行.clickme小號click -event的特定事件偵聽器後存在。
在我指定result其值之前，不會執行事件監聽器。
如何等待事件偵聽器完成？

Answer 1

如果它是未知的，可能多長時間來改變屬性，我會使用MutationObserver：

chrome.runtime.onMessage.addListener(function(request, sender, sendBack) { 
    $(".clickme").click(); 

    var target = $("#main-text")[0]; 
    new MutationObserver(function(mutations, observer) { 
    if (target.src) { 
     sendBack(target.src); 
     observer.disconnect(); 
    } 
    }).observe(target, { 
    attributes: true, 
    attributeFilter: ['src'], 
    }); 

    // keep the message channel open while waiting 
    return true; 
}); 

否則簡單的setTimeout可能做的伎倆。
只是不要忘記return true保持渠道暢通。