変更イベントが発生したときに、カーソルが最後のタイプの位置に設定されるのではなく、先頭に移動します。angular jsを使用してコンテンツ編集可能なdivを使用しています。
プランカー
http://plnkr.co/edit/FFaWNZmgk00Etubtjgg8?p=preview
カーソル位置が先頭に移動するのはなぜですか?
変更イベントが発生したときに、カーソルが最後のタイプの位置に設定されるのではなく、先頭に移動します。angular jsを使用してコンテンツ編集可能なdivを使用しています。
プランカー
http://plnkr.co/edit/FFaWNZmgk00Etubtjgg8?p=preview
カーソル位置が先頭に移動するのはなぜですか?
これは古い質問であることは知っていますが、この問題の解決策を見つけるために一日中検索しているので、この解決策をまだ有効な答えを探している可能性のある人々に共有したいと思います:
var el, el2, range, sel;
el = element[0];
range = document.createRange();
sel = window.getSelection();
if (el.childNodes.length > 0) {
el2 = el.childNodes[el.childNodes.length - 1];
range.setStartAfter(el2);
} else {
range.setStartAfter(el);
}
range.collapse(true);
sel.removeAllRanges();
sel.addRange(range);
このコードは、もともとakatov/angular-contenteditableディレクティブ、「moveCaretToEndOnChange」メソッドから取得しました。これは私にとってはうまくいきました。
Angular がinnerHTML
編集可能な要素のプロパティを書き換えていると仮定すると、その中のすべての DOM ツリーが破棄されて再作成され、その結果、キャレットが最初にリセットされます。考えられる解決策については、次の回答を参照してください。