Вопросы Теги

Как получить столбец каре (не пиксели) положение в текстовой области, в символах, от запуска?

174
задан John 29 May 2018 в 08:55
поделиться

3 ответа

С Firefox Safari (и другие основанные на гекконе браузеры) можно легко использовать textarea.selectionStart, но для IE, который не работает, таким образом, необходимо будет сделать что-то вроде этого: 

function getCaret(node) {
  if (node.selectionStart) {
    return node.selectionStart;
  } else if (!document.selection) {
    return 0;
  }

  var c = "\001",
      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;
}

( полный код здесь )

я также рекомендую Вам проверить Плагин jQuery FieldSelection, он позволяет Вам делать это и многое другое...

Редактирование: я на самом деле повторно реализовал вышеупомянутый код: 

function getCaret(el) { 
  if (el.selectionStart) { 
    return el.selectionStart; 
  } else if (document.selection) { 
    el.focus(); 

    var r = document.selection.createRange(); 
    if (r == null) { 
      return 0; 
    } 

    var re = el.createTextRange(), 
        rc = re.duplicate(); 
    re.moveToBookmark(r.getBookmark()); 
    rc.setEndPoint('EndToStart', re); 

    return rc.text.length; 
  }  
  return 0; 
}

Проверка пример здесь .

173
ответ дан Bakudan 23 November 2019 в 20:32
поделиться

Я изменил указанную выше функцию для учета возврата каретки в IE. Он не тестировался, но я сделал что-то подобное в своем коде, поэтому он должен работать. 

function getCaret(el) {
  if (el.selectionStart) { 
    return el.selectionStart; 
  } else if (document.selection) { 
    el.focus(); 

    var r = document.selection.createRange(); 
    if (r == null) { 
      return 0; 
    } 

    var re = el.createTextRange(), 
    rc = re.duplicate(); 
    re.moveToBookmark(r.getBookmark()); 
    rc.setEndPoint('EndToStart', re); 

    var add_newlines = 0;
    for (var i=0; i<rc.text.length; i++) {
      if (rc.text.substr(i, 2) == '\r\n') {
        add_newlines += 2;
        i++;
      }
    }

    //return rc.text.length + add_newlines;

    //We need to substract the no. of lines
    return rc.text.length - add_newlines; 
  }  
  return 0; 
}
3
ответ дан 23 November 2019 в 20:32
поделиться

Обновлено 5 сентября 2010 г.

Видя, что все, похоже, направляются сюда по этой проблеме, я добавляю свой ответ на аналогичный вопрос, который содержит тот же код, что и этот ответ, но с полной предысторией для тех, кто заинтересован :

IE document.selection.createRange не включает начальные и конечные пустые строки

Учет разрывов конечных строк в IE сложно, и я не видел ни одного решения, которое бы делало это правильно, включая любые другие ответы на этот вопрос. Однако можно использовать следующую функцию, которая вернет вам начало и конец выделения (которые одинаковы в случае курсора) в пределах