처음부터 문자의 텍스트 영역에서 캐럿 위치 가져오기 JavaScript를 사용하면 텍스트 편집 및 양식 유효성 검사와 같은 다양한 응용 프로그램에 유용할 수 있습니다. 캐럿의 문자 기반 위치를 얻으려면 브라우저의 호환성에 따라 다양한 방법을 사용할 수 있습니다.</p> <p>Firefox 및 Safari와 같은 Mozilla 기반 브라우저에서는 textarea.selectionStart에 직접 액세스하여 캐럿의 위치를 얻을 수 있습니다. 처음부터 캐릭터 용어. 그러나 Internet Explorer와 같은 브라우저의 경우 이 접근 방식이 작동하지 않을 수 있습니다.</p> <p>브라우저 간 호환성을 위해 다음 JavaScript 기능을 구현할 수 있습니다.</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre>function getCaret(node) { if (node.selectionStart) { return node.selectionStart; } else if (!document.selection) { return 0; } var c = "1", sel = document.selection.createRange(), dul = sel.duplicate(), len = 0; dul.moveToElementText(node); sel.text = c; len = dul.text.indexOf(c); sel.moveStart('character',-1); sel.text = ""; return len; }</pre><div class="contentsignin">로그인 후 복사</div></div> <p>이 기능은 document.selection을 활용합니다. 캐럿의 위치를 결정하기 위해 IE에서 사용할 수 있는 객체입니다. 먼저 범위 개체를 생성하고 복제한 다음 범위를 텍스트 영역의 시작 부분으로 이동합니다. 그런 다음 캐럿 위치에 특수 문자를 추가하고 후속 텍스트의 길이를 계산합니다. 이는 문자 기반 위치를 제공합니다.</p> <p>보다 포괄적인 솔루션을 위해 텍스트 영역에서 고급 텍스트 선택 및 조작 기능을 제공하는 jQuery FieldSelection 플러그인과 같은 플러그인이 있습니다.</p> <p>마지막으로 주의할 점은 코드에는 더욱 최적화된 getCaret 함수의 업데이트된 구현이 포함된 "편집" 섹션이 포함되어 있습니다. 최신 버전의 함수는 업데이트된 코드 예시를 꼭 참고하세요.</p>
