テキストエリア内のキャレット位置の取得 内のキャレット位置の決定要素はさまざまなテキスト編集操作にとって重要です。 JavaScript では、使用するブラウザに応じてこれを実現するための個別のアプローチがあります。</p> <p>selectionStart プロパティをサポートする Firefox や Safari などの最新のブラウザの場合、キャレットの列の位置を取得するのは簡単です。</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre>function getCaretColumn(textarea) { return textarea.selectionStart; }</pre><div class="contentsignin">ログイン後にコピー</div></div> <p>ただし、IE および従来のブラウザでは、このプロパティは利用できないため、より複雑な設定が必要です。解決策:</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre>function getCaretColumnIE(textarea) { var caret = document.selection.createRange(); var length = 0; var dul = caret.duplicate(); dul.moveToElementText(textarea); sel.text = '<pre>function getSurroundingStrings(textarea) { var start = textarea.selectionStart; var end = textarea.selectionEnd; return [ textarea.value.slice(0, start), textarea.value.slice(start, end), textarea.value.slice(end) ]; }</pre><div class="contentsignin">ログイン後にコピー</div></div>1'; length = dul.text.indexOf('1'); sel.moveStart('character', -1); sel.text = ""; return length; }</pre> <p><strong>カーソル周囲の文字列の取得</strong></p> <p>カーソルまたは選択範囲の周囲の文字列を取得するには、開始キャレットと終了キャレットの取得を組み合わせて使用できます。位置、およびテキストエリアの値のスライス:</p> <p>単語がまたはテキストが強調表示されている場合、この関数は選択範囲の前、選択範囲内、選択後の文字列を返します。</p>
