자바 스크립트를 SelectionChange-의 EventListener는 document.execCommand

Question

에 무한 트리거 나는

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

다음 내가 선택한 텍스트를 강조하기 위해, 아래의 코드를 추가 한, 아래 selectionchange에 대한 이벤트 리스너를 추가했습니다. 내가 선택을 해제 할 때까지

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

하이라이트 함수가 호출

,를 SelectionChange에 대한 EventListener은 무한히 발생합니다.

같은 문제에 직면 한 사람이 있습니까? 어느 누구도이 문제를 해결할 수있는 해결책을 제시 할 수 있습니까?

Answer 1

간단한 플래그를 사용하여 무한 루프를 방지하는 것이 좋습니다. document.execCommand()이 호출 될 때 selectionchange 이벤트가 동 기적으로 실행되지 않기 때문에 window.setTimeout() 호출이 있습니다.

데모 : 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);