19

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

ユーザーが絵文字を追加できるチャットシステムを構築しています。

上記のjsfiddlerの例と同じように、テキストエリアの現在のテキストを取得し、選択した絵文字シンボルと組み合わせて、このテキストをテキストエリアに追加し直します。

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

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

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

4

4 に答える 4

36

簡単にできることは、テキスト領域の値をリセットすることです。

$(function() {
    var data = $('textarea').val();
    var emoticon = ':)';
    $('textarea').focus().val('').val(data + emoticon);
});
于 2012-11-16T22:31:48.387 に答える
10

最初にフォーカスし、次に値を設定します。このJSFiddleのように

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

別の方法は、.focus（）の後にこれを追加することです。

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

テキストエリアの最後にスペースが追加されるため、最後にフォーカスされます。

于 2012-11-16T22:34:52.913 に答える
1

非常に簡単な解決策。

var emoticon = ':)';
var val = $('#textarea').val();
$('#textarea').select().val(val + emoticon);
于 2013-11-02T22:34:39.643 に答える
0

この質問を確認する必要があります。

jQueryはテキスト領域にカーソル位置を設定します

そこからの最もエレガントな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);
于 2012-11-16T22:36:39.230 に答える