programing

자바 스크립트에서 선택된 텍스트 이벤트 트리거

nasanasas 2020. 11. 17. 08:11
반응형

자바 스크립트에서 선택된 텍스트 이벤트 트리거


누군가 마우스를 사용하여 페이지에서 주어진 텍스트 조각선택할 때 JavaScript 함수트리거하는 방법은 무엇입니까?
또한 페이지에서 선택한 텍스트의 위치찾는 방법이 있습니까?

업데이트 : 더 명확하게 말하면 텍스트 조각은 문장의 일부 나 단어, 구 또는 단락 전체 일 수 있습니다.


" 텍스트가 선택되었습니다 " (DOM)이벤트는 없지만 mouseup이벤트를에 바인딩 할 수 있습니다 document.body. 해당 이벤트 핸들러 내에서

document.selection.createRange().text

또는

window.getSelection()

행동 양식. Stackoverflow 에는 웹 페이지에서 선택한 텍스트의 단락을 가져 오는 자바 스크립트 와 같은 몇 가지 주제가 있습니다 .

"위치 찾기"가 무엇을 의미하는지 잘 모르겠지만 내 예제 세계에 머물기 event propertys위해 X + Y 마우스 위치에를 사용할 수 있습니다 .

예 : http://www.jsfiddle.net/2C6fB/1/


다음은 빠른 매시업입니다.

$('div').mouseup(function() {
    var text=getSelectedText();
    if (text!='') alert(text);
});

function getSelectedText() {
    if (window.getSelection) {
        return window.getSelection().toString();
    } else if (document.selection) {
        return document.selection.createRange().text;
    }
    return '';
}​

<div>Here is some text</div>

데모 : http://jsfiddle.net/FvnPS/11/


이를 처리하는 새로운 실험 API가 있습니다.

선택의 API를 SelectionChange 이벤트는 문서의 선택 오브젝트가 변경되었을 때 소성하거나 될 때와 관련된 선택 <input>또는 <textarea>변화. selectionchange 이벤트는 첫 번째 경우에는 문서에서, 두 번째 경우에는 요소에서 발생합니다.

https://developer.mozilla.org/en-US/docs/Web/Events/selectionchange

이것은 최첨단이며 주요 브라우저에서도 작동한다는 보장은 없습니다.


AFAIK, 설명하신 이벤트가 없습니다. 하지만 그 기능을 모방 할 수 있습니다.

이상 봐 여기에 코드와 데모.


"텍스트가 선택되었습니다"이벤트가 있습니다. 하지만 내가 아는대로 텍스트 영역에 대해서만.

<textarea onselect="message()" name="summary" cols="60" rows="5">
请写入个人简介,不少于200字!
</textarea>

참고 URL : https://stackoverflow.com/questions/3545018/selected-text-event-trigger-in-javascript

반응형