挿入ポイントが現在textarea/contenteditableに配置されている場所を確認します。

Question

私は現在、動的テキスト領域を作成しようとしていますが、イベントをブロックして、 の挿入ポイントが現在のtextareaまたはcontenteditableディバイダにあるかどうかを調べる必要があるという結論に至りました。

私はjQueryの内のイベント​​とkeyupを使用しましたが、クリックがディバイダに行われたとき、彼らはログインしない、と私は私が後だものを見つけるためにeventオブジェクトで見て知っているではないでしょう。

たとえば、空のテキストエリアにあり、テキストエリアをクリックした場合、それは最初であるため、0を返します。テキストを書き込むと、より多くの文字がテキストエリア。

Answer 1

selectionStartとselectionEndのプロパティはtextareaです。 contenteditable要素の場合は、window.getSelection()を使用できます。

$('#text1').on('keyup click', function() { 
 
    console.log('Selection start :', $(this).prop('selectionStart')); 
 
    console.log('Selection end :', $(this).prop('selectionEnd')); 
 
}); 
 

 
$('#text2').on('keyup click', function() { 
 
    console.log(window.getSelection().getRangeAt(0).startOffset); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea id="text1"></textarea> 
 
<div id="text2" contenteditable>some text</div>