contenteditable에서 @와 캐럿 사이의 문자 범위를 얻는 방법

Question

콘텐츠 편집 가능한 div가 있으며 일반 텍스트뿐만 아니라 다른 태그도 포함되어 있습니다. @는 하나만 허용됩니다. 범위가 존재하면 @와 캐럿 사이의 문자 범위를 어떻게 얻을 수 있습니까?

Answer 1

내가 생각했던 것보다 더 쉬웠다. 이 간과하기 쉬운 질문을 바탕으로 : Div "contenteditable" : get and delete word preceding caret 여기의 jsfiddle을 포크와 것은 나의 예상대로 작동 :

http://jsfiddle.net/52m2thu2/1/

function getWordBetweenAtAndCaret(containerEl) { 
    var preceding = "", 
     sel, 
     range, 
     precedingRange; 
    if (window.getSelection) { 
     sel = window.getSelection(); 
     if (sel.rangeCount > 0) { 
      range = sel.getRangeAt(0).cloneRange(); 
      range.collapse(true); 
      range.setStart(containerEl, 0); 
      preceding = range.toString(); 
     } 
    } else if ((sel = document.selection) && sel.type != "Control") { 
     range = sel.createRange(); 
     precedingRange = range.duplicate(); 
     precedingRange.moveToElementText(containerEl); 
     precedingRange.setEndPoint("EndToStart", range); 
     preceding = precedingRange.text; 
    } 
    var lastWord = preceding.match(/@(.+)$/i); 
    if (lastWord) { 
     return lastWord; 
    } else { 
     return false; 
    } 
}