2

div をクリックするだけでテキストエリアに情報を追加できるスクリプトがあります。これは機能していますが、カーソルは常に挿入した情報の先頭にあります。

<div id="click">Click to insert</div>
<textarea id="info">I want to</textarea>

ここにjqueryがあります:

<script>
    $(document).ready(function(){
        $('#click').on('click',function(){
            var i=$('#info').val();
            var n="Insert this";//information to be inserted
            $('#info').val(i + n).focus();
        });
    });
</script>

これで、全体がI want to insert thisの後にカーソルが続きます。代わりに、このようにカーソルが真ん中にある[カーソル] を挿入したい. フィールドの内容の最後にカーソルを合わせる方法はありますか?

4

2 に答える 2

3

これを試してみてください JSFiddle http://jsfiddle.net/adiioo7/2D9Td/ :-

$(document).ready(function () {
    $('#click').on('click', function () {
        var i = $('#info').val();
        var n = "Insert this"; //information to be inserted
        $('#info').focus().val(i + n);
    });
});

最後の js 呼び出しで focus と val のシーケンスを変更しただけです。

于 2013-02-13T15:05:02.163 に答える
0

jQueryプラグインはどうですか?

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

$(document).ready(function () {
    $('#click').on('click', function () {
        var i = $('#info').val();
        var n = "Insert this";

        $('#info').val(i + n).focus().setCaretToEnd();
    });
});

フィドル

于 2013-02-13T15:07:05.363 に答える