質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

3回答

8664閲覧

textareaのキャレットを取得したい

97556N

総合スコア12

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2016/12/12 02:56

###前提・実現したいこと
javascriptを使用して画面を作っているのですが、textarea内のキャレット(カーソルの位置)
を取得したい

###試したこと
自分なりに調べて記述して見ましたが、的外れな値を取得してしまう。
例、三文字目にキャレットがある場合、"3"を取得して欲しいが"16"が取得される

###補足情報(言語/FW/ツール等のバージョンなど)
訳あってソースは記載できないのですが、ネットにあがっていたソースを丸コピーして少し書き換えた程度です。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

hitsujimeeee

2016/12/12 03:06

ソースが無ければどこをどう直すか、具体的な説明はできません。ここにいる人は頼めばプログラムを書いてくれる何でも屋ではありませんので
97556N

2016/12/12 07:13

すいません。<input type="text" size=30 id="my_input" value="hogefuga"> <input type="button" onclick="f()" value="キャレットの位置を取得"> <script language="JavaScript"> function f() { var elem = document.getElementById( "my_input" ); } function getCaretPositionIE( elem ) { elem.focus(); var range = document.selection.createRange(); range.moveStart( "character", - elem.value.length ); var caret_position = range.text.length; return caret_position; } </script>
guest

回答3

0

こういうところのソースをコピペした感じでしょうか。

テキストボックス内のカーソル(キャレット)位置や選択範囲を,JavaScriptで取得・設定する方法

document.selection.createRange()メソッドは古いIEにしか対応しておらず、IE11では動かなかった覚えがあります。

IE11ならキャレットの開始位置をelem.selectionStartで取得可能です。

また、他の方が仰っている通りブラウザによってやり方も変わってきます。

投稿2016/12/12 08:09

編集2016/12/12 08:17
hitsujimeeee

総合スコア486

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

97556N

2016/12/13 02:30

ご回答ありがとうございます。 IE11での実装を予定しています。
guest

0

ブラウザは何ですか?

Firefox などの場合は、選択された部分の先頭、末尾の index (整数型)を、それぞれ selectionStart、selectionEnd で取得できます。

IE の場合(少なくとも IE9 まで。Edge とかは変わっているかも)はそれに該当するプロパティがないのが問題ですが、代わる方法はあります。

詳しくは以下の記事が参考になると思います。

textarea のキャレット位置に文字列を挿入
http://surferonwww.info/BlogEngine/post/2012/01/09/Inserting-string-at-caret-position-in-textarea.aspx

投稿2016/12/12 03:46

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

97556N

2016/12/13 02:30

IE11の実装予定しています。
guest

0

ブラウザによってカーソル位置のとり方はかわってきます
汎用性は必要ですか?それともブラウザを限定していいですか?

投稿2016/12/12 03:19

yambejp

総合スコア114583

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

97556N

2016/12/13 02:31

使用しているブラウザはIE11です。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問