在textarea中查找光標的位置

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>

你必須在textarea上按Tab鍵

問題是它沒有/附加四個空格並且它默認瀏覽器操作（切換到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中操作textarea選擇和插入位置，我建議使用我的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上運行。 如果有人設法獲得按鈕按下選擇文本textarea與Chrome工作，請隨時告訴我。

Answer 4

在jQuery中查看Keypress：在TEXTAREA中按TAB（編輯現有文本時）

Answer 5

嘗試這個，我確定它會起作用。

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

                     $("textarea").append("    "); 
                     return false;
        } 
    }); 
}); 
</script>

我只是簡單地將單詞“keyCode”改為“which”，因為單詞keyCode是從jquery ui派生的。