jQueryの設定テキストエリアカーソルがテキスト

Question

http://jsfiddle.net/adamadam123/gEEVM/4/

私は、ユーザーが絵文字を追加することができますチャットシステムを構築していますの最後に。

上記のjsfiddlerの例のように、私はテキストエリア内の現在のテキストを取り出し、選択した絵文字の記号と組み合わせて、このテキストをテキストエリアに追加し直します。

$(function() { 
    var data = $('textarea').val(); 
    var emoticon = ':)'; 
    $('textarea').val(data + emoticon); 
    $('textarea').focus(); 
}); 

問題は、カーソルがテキストの先頭にあるテキストエリアにフォーカスを戻したときです。

さらに入力を許可するために、カーソルをテキストの最後に設定するにはどうすればよいですか？

$(function() { 
    var data = $('textarea').val(); 
    var emoticon = ':)'; 
    $('textarea').focus().val('').val(data + emoticon); 
}); 

Answer 1

何かがテキスト領域の値をリセットです。ただ、このJSFiddle

$('textarea').focus(); 
$('textarea').val("New Text"); 

のようなもう一つの方法は、.focus（後にこれを追加することです）。

$('textarea').val($('textarea').val() + ' '); 

それは終わりに焦点を当てので、テキストエリアの末尾にスペースを追加します。

あなたはこの質問見直すべき

Answer 2

まずフォーカスし、設定された値：あなたが行うことができ、簡単な

Answer 3

：そこから

jQuery Set Cursor Position in Text Area

最もエレガントなjQueryのソリューション：これにより

$.fn.selectRange = function(start, end) { 
    return this.each(function() { 
     if (this.setSelectionRange) { 
      this.focus(); 
      this.setSelectionRange(start, end); 
     } else if (this.createTextRange) { 
      var range = this.createTextRange(); 
      range.collapse(true); 
      range.moveEnd('character', end); 
      range.moveStart('character', start); 
      range.select(); 
     } 
    }); 
}; 

は、あなたが行うことができます

$('#elem').selectRange(3,5); 

Answer 4

A 非常に単純な解決策です。

var emoticon = ':)'; 
var val = $('#textarea').val(); 
$('#textarea').select().val(val + emoticon);