Найти положение курсора в текстовой области

Question

Почему этот код не работает?

http://sandbox.phpcode.eu/g/5db40.php

<form>
   <textarea></textarea>
</form>
<script>
$(function(){
    $("textarea").keydown(function(e){
        if (e.keyCode == 9){

                     $("textarea").selectionStart.append("    ");
                     e.preventDefault();
        }
    });
});
</script>

Вы должны нажать TAB на textarea

Проблема в том, что он не добавляет / не добавляет четыре пробела и выполняет действия браузера по умолчанию (переключиться на вкладку адреса в Chrome)

Мысли

Answer 1

Относительно этого вопроса, попробуйте:

$(function () {
    $("textarea").keydown(function (e) {
        if (e.keyCode == 9) {
            e.preventDefault();
            var $this = $(this);
            var pos = $this[0].selectionStart;
            $this.val($this.val().substring(0, pos) + "    " + $this.val().substring(pos));
            $this.setCursorPosition(pos + 4);
        }
    });
});

И добавьте JQuery из этого сообщения.

new function($) {
  $.fn.setCursorPosition = function(pos) {
    if ($(this).get(0).setSelectionRange) {
      $(this).get(0).setSelectionRange(pos, pos);
    } else if ($(this).get(0).createTextRange) {
      var range = $(this).get(0).createTextRange();
      range.collapse(true);
      range.moveEnd('character', pos);
      range.moveStart('character', pos);
      range.select();
    }
  }
}(jQuery);

Answer 2

Для манипулирования выделением текстовой области и позициями каретки в jQuery я рекомендую использовать для этого мой плагин jQuery , который работает во всех основных браузерах и предоставляет методы для получения и установки позиции каретки / выбора,вставка контента в позицию каретки и многое другое.Код, который вы хотите, будет:

$("textarea").keydown(function(e) {
    if (e.keyCode == 9) {
        e.preventDefault();
        $(this).replaceSelectedText("    ");
    }
});

Answer 3

var range = $(this).get(0).createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();

Это ( JSFiddle ) было лучшим, чем я мог управлять, но я не могу заставить его работать на Firefox или Chrome.Если кому-то удастся нажать кнопку, выберите текст в текстовой области с работающим Chrome, дайте мне знать.

Answer 4

Попробуйте, я чертовски уверен, что это сработает.

<form> <br/>   <textarea></textarea> <br/></form> <br/><script> <br/>$(function(){ <br/>    $("textarea").keydown(function(e){ <br/>        if (e.which == 9){ <br/><br/>                     $("textarea").append("    "); <br/>                     return false;<br/>        } <br/>    }); <br/>}); <br/></script>

Я просто изменил слово «keyCode» на «которое», потому что слово keyCode происходит от jquery ui.

Answer 5

Посмотрите на Нажатие клавиши в jQuery: нажмите TAB внутри TEXTAREA (при редактировании существующего текста)