[JQUERY] TextArea에서 커서 위치를 어떻게 얻습니까?

TextArea에서 커서 위치를 어떻게 얻습니까?

해결법

1. ---

   1.선택이없는 경우 등록 정보를 사용할 수 있습니다. 선택 항목 또는. 선택 (선택 사항이 동일하지 않음).

   선택이없는 경우 등록 정보를 사용할 수 있습니다. 선택 항목 또는. 선택 (선택 사항이 동일하지 않음).

   var cursorPosition = $('#myTextarea').prop("selectionStart");
   

   이전 브라우저에서는 지원되지 않습니다. 특히 IE8-에서는 지원되지 않습니다. 텍스트 범위로 작업해야하지만 완전한 좌절입니다.

   그러나 입력 요소에서 선택 / 커서 위치를 가져오고 설정하는 데 전념하는 도서관이 있습니다. 나는 그 이름을 기억할 수는 없지만,이 주제에 관한 기사에 수십개가있는 것처럼 보입니다.

2. ---

   2.다음은 내 표준 라이브러리에있는 브라우저 기능이 있습니다.

   다음은 내 표준 라이브러리에있는 브라우저 기능이 있습니다.

   function getCursorPos(input) {
       if ("selectionStart" in input && document.activeElement == input) {
           return {
               start: input.selectionStart,
               end: input.selectionEnd
           };
       }
       else if (input.createTextRange) {
           var sel = document.selection.createRange();
           if (sel.parentElement() === input) {
               var rng = input.createTextRange();
               rng.moveToBookmark(sel.getBookmark());
               for (var len = 0;
                        rng.compareEndPoints("EndToStart", rng) > 0;
                        rng.moveEnd("character", -1)) {
                   len++;
               }
               rng.setEndPoint("StartToStart", input.createTextRange());
               for (var pos = { start: 0, end: len };
                        rng.compareEndPoints("EndToStart", rng) > 0;
                        rng.moveEnd("character", -1)) {
                   pos.start++;
                   pos.end++;
               }
               return pos;
           }
       }
       return -1;
   }
   

   다음과 같이 코드에서 사용하십시오.

   var cursorPosition = getCursorPos($('#myTextarea')[0])
   

   여기에 보완적인 기능이 있습니다.

   function setCursorPos(input, start, end) {
       if (arguments.length < 3) end = start;
       if ("selectionStart" in input) {
           setTimeout(function() {
               input.selectionStart = start;
               input.selectionEnd = end;
           }, 1);
       }
       else if (input.createTextRange) {
           var rng = input.createTextRange();
           rng.moveStart("character", start);
           rng.collapse();
           rng.moveEnd("character", end - start);
           rng.select();
       }
   }
   

   http://jsfiddle.net/gilly3/6SUN8/

3. ---

   3.다음은 줄 번호와 열 위치를 가져 오는 코드입니다.

   다음은 줄 번호와 열 위치를 가져 오는 코드입니다.

   function getLineNumber(tArea) {
   
       return tArea.value.substr(0, tArea.selectionStart).split("\n").length;
   }
   
   function getCursorPos() {
       var me = $("textarea[name='documenttext']")[0];
       var el = $(me).get(0);
       var pos = 0;
       if ('selectionStart' in el) {
           pos = el.selectionStart;
       } else if ('selection' in document) {
           el.focus();
           var Sel = document.selection.createRange();
           var SelLength = document.selection.createRange().text.length;
           Sel.moveStart('character', -el.value.length);
           pos = Sel.text.length - SelLength;
       }
       var ret = pos - prevLine(me);
       alert(ret);
   
       return ret; 
   }
   
   function prevLine(me) {
       var lineArr = me.value.substr(0, me.selectionStart).split("\n");
   
       var numChars = 0;
   
       for (var i = 0; i < lineArr.length-1; i++) {
           numChars += lineArr[i].length+1;
       }
   
       return numChars;
   }
   

   Tarea는 텍스트 영역 DOM 요소입니다

from https://stackoverflow.com/questions/7745867/how-do-you-get-the-cursor-position-in-a-textarea by cc-by-sa and MIT license