テキストエリア内の文字のキャレット列の位置を取得する 内のキャレット位置を決定するさまざまなテキスト編集操作を可能にするために必要です。さまざまなブラウザーの微妙な違いを考慮して、JavaScript でこれをどのように実現しますか?</p> <p>Firefox や Safari などのブラウザーの場合、textarea.selectionStart を利用することで簡単な解決策が得られます。ただし、Internet Explorer では、別のアプローチが必要です。両方のケースに対応する堅牢なソリューションを次に示します。</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre>function getCaret(node) { if (node.selectionStart) { return node.selectionStart; } else if (!document.selection) { return 0; } var c = "<pre>function getCaret(el) { if (el.selectionStart) { return el.selectionStart; } else if (document.selection) { el.focus(); var r = document.selection.createRange(); if (r == null) { return 0; } var re = el.createTextRange(), rc = re.duplicate(); re.moveToBookmark(r.getBookmark()); rc.setEndPoint('EndToStart', re); return rc.text.length; } return 0; }</pre><div class="contentsignin">ログイン後にコピー</div></div>1", sel = document.selection.createRange(), dul = sel.duplicate(), len = 0; dul.moveToElementText(node); sel.text = c; len = dul.text.indexOf(c); sel.moveStart('character',-1); sel.text = ""; return len; }</pre> <p>さらに、jQuery FieldSelection プラグインは、キャレット位置を取得し、高度なテキスト選択操作を実行する便利な方法を提供します。</p> <p><strong>更新された実装:</strong></p> <p>getCaret の更新バージョンは次のとおりです。精度を向上させる関数:</p> <p>これらのソリューションを使用すると、<textarea> 内の正確なキャレット位置を効果的に決定できます。使用しているブラウザに関係なく、JavaScript で使用できます。</p>
