13

タブを正しく挿入できるように、現在の位置のちょうど4スペース前にキャレットを移動しようとしています。キャレットの位置でのHTML挿入はすでに機能していますが、HTMLを挿入すると、カレットが残ります。私は過去1時間ほどこれを行うためのさまざまな方法を検討し、それらをたくさん試しましたが、どれも私のために機能させることができません。これが私が試した最新の方法です:

function moveCaret(input, distance) {
    if(input.setSelectionRange) {
        input.focus();
        input.setSelectionRange(distance, distance);
    } else if(input.createTextRange) {
        var range = input.createTextRange();
        range.collapse(true);
        range.moveEnd(distance);
        range.moveStart(distance);
        range.select();
    }
}

それは絶対に何もしません-カレットを動かしたり、エラーを投げたりすることはありません。これは私を困惑させます。そして、はい、私は上記のメソッドセット(になっている)が指定されたノードの先頭から特定の位置(つまり)にカレットを設定することを知っていますが、inputそれでも機能していません。それで、私は正確に何を間違っているのですか、そしてどうすればそれを正しく行うことができますか?


編集:ovが提供したリンクに基づいて、私は最終的に何かをしている何かを一緒に石畳にすることができました:エラーをスローします。わーい!新しいコードは次のとおりです。

this.moveCaret = function(distance) {
    if(that.win.getSelection) {
        var range = that.win.getSelection().getRangeAt(0);
        range.setStart(range.startOffset + distance);
    } else if (that.win.document.selection) {
        var range = that.win.document.selection.createRange();
        range.setStart(range.startOffset + distance);
    }
}

さて、これはエラーを与えますUncaught Error: NOT_FOUND_ERR: DOM Exception 8。なぜ何かアイデアはありますか?

4

1 に答える 1

23

contenteditableあなたが持っているコードスニペットは、要素ではなく、テキスト入力とテキストエリア用です。

すべてのコンテンツが 1 つのテキスト ノードにあり、選択内容がその中に完全に含まれている場合、IE 6 を含むすべての主要なブラウザーで次のように動作します。

デモ: http://jsfiddle.net/9sdrZ/

コード:

function moveCaret(win, charCount) {
    var sel, range;
    if (win.getSelection) {
        // IE9+ and other browsers
        sel = win.getSelection();
        if (sel.rangeCount > 0) {
            var textNode = sel.focusNode;
            var newOffset = sel.focusOffset + charCount;
            sel.collapse(textNode, Math.min(textNode.length, newOffset));
        }
    } else if ( (sel = win.document.selection) ) {
        // IE <= 8
        if (sel.type != "Control") {
            range = sel.createRange();
            range.move("character", charCount);
            range.select();
        }
    }
}
于 2012-05-28T09:19:09.430 に答える