dom 요소에 강조 표시된 텍스트가 포함되어 있는지 확인

웹 응용 프로그램에서 텍스트 요소에 대한 click 및 mouseup 이벤트에 대해 다른 동작을 구현하려고합니다. mouseup 이벤트에서 선택한 텍스트가 있는지 확인하고 그 텍스트로 무언가를합니다. 클릭 이벤트에서 나는 클릭 된 텍스트와 관련하여 어딘가를 탐색하는 것과 같은 다른 작업을 수행합니다. 그러나 선택된 텍스트가있는 경우 click 이벤트에서 코드를 실행하지 않으며 이것이 막힌 부분입니다. 여기에 내가 지금 뭐하는 거지의 모달 :dom 요소에 강조 표시된 텍스트가 포함되어 있는지 확인

//the function that returns selected text as string 
 
function getSelectionText() { 
 
    var text = ""; 
 
    if (window.getSelection) { 
 
    text = window.getSelection().toString(); 
 
    } else if (document.selection && document.selection.type != "Control") { 
 
    text = document.selection.createRange().text; 
 
    } 
 
    return text; 
 
} 
 

 
function onMouseUp(event) { 
 
    var selection = getSelectionText(); 
 
    if (selection != "") { 
 
    alert("Selected text: " + selection); 
 
    } 
 

 
} 
 

 
function onClick(event) { 
 
    alert("You clicked the text."); 
 
}

<body> 
 
    <h2 onclick="onClick(); return false;" onmouseup="onMouseUp(); return false;"> 
 
    text to click or select 
 
    </h2> 
 
</body>

내가 온 클릭 처리기에서 이런 일을하고 싶지는

function onClick(event) 
{ 
    if (!hasSelectedParts(this)) // want to implement hasSelectedParts() function 
    { 
     alert("You clicked the text."); 
    } 
}

어떻게 구현할 수 domElement (hasSelectedParts 그) 함수? 즉, 에는 DOM 요소에 선택한 일부 부품이 있는지 여부를 쉽게 감지 할 수있는 방법이 있습니다.

출처

2017-04-03 t.m.

'window.getSelection(). anchorNode'? 여전히 크롤링해야 할 수도 있지만 항목은 – dandavis

입니다. @dandavis를 Seconding - [window.getSelection]에 대한 설명서를 확인하십시오 (https://developer.mozilla.org/en-US/docs/Web/API/). Window/getSelection). –

의견에 도움을 주셔서 감사합니다. 다음은 내가 생각해 낸 것입니다 :

function hasSelectedContend(element) 
{ 
    var selection = window.getSelection(); 
    return !selection.isCollapsed // selection data is about currently highlighted text 
     && selection.anchorNode !== null // there is a selection 
     && selection.anchorNode.parentNode === element; //selection is in the element 
}

출처

2017-04-04 19:04:53

dom 요소에 강조 표시된 텍스트가 포함되어 있는지 확인

답변

관련 문제