[解決済み】テキスト入力フィールド内のカーソル位置(文字数)を取得する。
2022-04-17 17:03:38
質問
入力フィールドの中からキャレットの位置を取得するには?
私はGoogleでいくつかの断片を見つけましたが、弾丸の証拠は何もありません。
基本的にjQueryのプラグインのようなものが理想的で、単純に以下のようなことができます。
$("#myinput").caretPosition()
解決方法は?
アップデートが容易になる。
使用方法
field.selectionStart
この回答例
.
ご指摘いただいた@commonSenseCodeさんに感謝します。
古い回答です。
こんな解決策を見つけました。jqueryベースではありませんが、jqueryに統合するのは問題ないでしょう。
/*
** Returns the caret (cursor) position of the specified text field (oField).
** Return value range is 0-oField.value.length.
*/
function doGetCaretPosition (oField) {
// Initialize
var iCaretPos = 0;
// IE Support
if (document.selection) {
// Set focus on the element
oField.focus();
// To get cursor position, get empty selection range
var oSel = document.selection.createRange();
// Move selection start to 0 position
oSel.moveStart('character', -oField.value.length);
// The caret position is selection length
iCaretPos = oSel.text.length;
}
// Firefox support
else if (oField.selectionStart || oField.selectionStart == '0')
iCaretPos = oField.selectionDirection=='backward' ? oField.selectionStart : oField.selectionEnd;
// Return results
return iCaretPos;
}
関連
-
[解決済み] Webフォームのフィールド/入力タグでブラウザのオートコンプリートを無効にするにはどうすればよいですか?
-
[解決済み] jQueryを使ってドロップダウンリスト(セレクトボックス)から選択されたテキストを取得する
-
[解決済み] jQuery get specific option tag text
-
[解決済み] JavaScriptでテキスト入力フィールドの値を取得するにはどうすればよいですか?
-
[解決済み] 入力テキストボックスの値を取得する
-
[解決済み] 文字列の最後の文字を取得する方法
-
[解決済み] 入力フィールドから属性を読み込むと、HTMLエンコーディングが失われる
-
[解決済み] HTMLのテキスト入力でクリックするとすべてのテキストが選択される
-
[解決済み] jQuery テキストエリアでのカーソル位置の設定
-
[解決済み】HTMLのテキスト入力で数値入力しかできない。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】TypeError: $(...).DataTable は関数ではありません。
-
[解決済み】TypeError: 'undefined'はオブジェクトではありません。
-
[解決済み】Uncaught ReferenceError: angular is not defined - AngularJSが動作しない。
-
[解決済み】Uncaught TypeError: nullのプロパティ'value'を読み取ることができない
-
[解決済み】XMLパースエラー:ルート要素が見つからない コンソールの場所 FF
-
[解決済み】DOMException: サポートされているソースが見つからなかったため、読み込みに失敗しました。
-
[解決済み】FirefoxでGoogle Maps V3をリモートで使用すると「googleが定義されていません」と表示される。
-
[解決済み] [Solved] Uncaught Invariant Violation: 前のレンダリング中よりも多くのフックをレンダリングする
-
[解決済み】react router v^4.0.0 Uncaught TypeError: 未定義のプロパティ'location'を読み取れない
-
[解決済み] テキストエリア内のキャレットの列(ピクセルではない)位置を最初から文字単位で取得するにはどうしたらよいですか?