3

テキスト領域にカーソルを置き、同じページのツリービューノードをクリックして、ツリーノードをクリックする直前にカーソルを置いたテキスト領域にノードのテキストを選択する必要があるシナリオがあります。

私は以下を含むスタックオーバーフローについて多くの答えを得ました、

カーソルが置かれている場合はカーソル位置のtextareaにテキストを挿入します。そうでない場合は、IEでテキストを最後に追加する必要があります。

テキストのカーソル位置の後にテキストを挿入する

jQueryを使用してtextareaにテキストを挿入します

テキストエリアの現在のキャレット位置にテキストを挿入する方法

Javascriptを使用して、テキストエリアのカーソルにテキストを挿入する

カーソルがある場所にテキストを挿入するにはどうすればよいですか？

FFとChromeは上記のソリューションで正常に動作しますが、フォーカスを他のコントロールに移動すると、IE 8以前のバージョンは失敗します（IE9ではチェックしませんでした）。

ほとんどすべての投稿に、IEの以下または同様の実装があります。

(function ($) {
    $.fn.getCursorPosition = function () {
        var el = $(this).get(0);
        var pos = 0;
        if ('selectionStart' in el) {
            pos = el.selectionStart;
        } else if ('selection' in document) {
            el.focus();
            var Sel = document.selection.createRange();
            var SelLength = document.selection.createRange().text.length;
            Sel.moveStart('character', -el.value.length);
            pos = Sel.text.length - SelLength
        }
        return pos;
    }
})(jQuery);

注：if(el.selectionStart || el.selectionStart == '0') の代わりにif ('selectionStart' in el) 、 のif(document.selection)代わりに使用することもできますif ('selection' in document)

ただし、フォーカスを最初に他のコントロールに移動してから実行すると、これは失敗します。私の場合、ユーザーがノードをトラバースすると、フォーカスはツリーノードに移動します。

このシナリオの解決策はありますか？

onkeyupとonclickをテキスト領域に書き込み、そのカーソル位置を非表示フィールドに保存することを考えているので、フォーカスを他のコントロールに移動すると、テキスト領域のカーソル位置を取得するための非表示フィールドがあります。後でここに投稿しますが、誰かが何か良いアイデアを持っているなら、共有してください。

前もって感謝します

4

2 に答える 2

2

上で述べたように、IEでも機能させるための以下のコードがあります（これらの2つのイベントの代わりにonblurのみを使用することも考えましたが、実行がコードに入って非表示の変数を設定したときにフォーカスが失われたため、機能しませんでした）

実装の下私の場合は正常に動作しています。

if ($("#myTextArea").get(0).selectionStart == undefined) {
    $("#myTextArea").click(function (e) {
        $("#hdnTextAreaPosition").val($("#myTextArea").getCursorPosition());
    });
    $("#myTextArea").keyup(function (e) {
        $("#hdnTextAreaPosition").val($("#myTextArea").getCursorPosition());
    });
}

上記のイベント（キーアップとクリック）はグローバルスクリプトにあり、selectStartが未定義の場合にのみ添付されます

function getTextAreaCursorPosition() {
    if ($("#myTextArea").get(0).selectionStart == undefined) {
        return $("#hdnTextAreaPosition").val();
    }
    else {
        return $("#myTextArea").getCursorPosition();
    }
}


function insertToMyTextArea(textToInsert) {
    $("#myTextArea").focus();
    var cursorPosition = getTextAreaCursorPosition();
    var myContent = $("#myTextArea").val();
    $("#myTextArea").val(myContent.substring(0, cursorPosition) + textToInsert + myContent.substring(cursorPosition));
}

insertToMyTextAreaは、ツリーノードのクリックで呼び出すメイン関数です。

イベントを開催する代わりに代替ソリューションが利用できる場合は、ご意見をお聞かせください。

于 2012-11-07T13:39:41.693 に答える
1

フォーカスが失われる前に、テキストエリアの選択またはカーソル位置を保存するために、jQueryプラグインをいくつかの追加のものと組み合わせて使用​​することをお勧めします。

私は以前の回答でこの正確なケースをカバーしました：

https://stackoverflow.com/a/5890708/96100

于 2012-11-07T14:50:32.787 に答える