的JavaScript selectionchange-事件監聽，對document.execCommand

Question

無限觸發我已添加的事件偵聽器selectionchange如下，

document.addEventListener("selectionchange", 
function() 
{ 
    highlight(); 
    console.log("selectionchange-triggered"); 
}, false); 

然後我已經添加了下面的代碼，以突出顯示選定的文本。

function highlight() 
{ 
    document.designMode = "on"; 
    document.execCommand("hiliteColor", false, "#ff0000"); 
    document.designMode = "off"; 
} 

當高亮函數被調用時，EventListener爲selectionchange直到我清除選擇被無限激發。

有沒有遇到同樣的問題？任何人都可以提出解決方案來解決這個問題嗎？

Answer 1

我建議使用一個簡單的標誌來防止無限循環。 window.setTimeout()調用存在，因爲調用document.execCommand()時selectionchange事件不會同步觸發。

演示：http://jsfiddle.net/rzmstcot/5/

代碼：

var highlighting = false; 

function highlight() 
{ 
    document.designMode = "on"; 
    highlighting = true; 
    document.execCommand("hiliteColor", false, "#ff0000"); 
    document.designMode = "off"; 
    window.setTimeout(function() { 
     highlighting = false; 
    }, 1); 
} 

document.addEventListener("selectionchange", 
function() 
{ 
    if (!highlighting) { 
     highlight(); 
    } 
    console.log("selectionchange-triggered"); 
}, false);