JavaScriptのキーイベントでのフォーム項目移動に関する問題
- JavaScriptのキーイベントを使用してフォーム上の項目移動を行いたい場合、IEでは問題なく動作するが、Firefoxでは移動先のセレクトボックスの値が変化してしまう問題が発生することがあります。
- この問題は、Firefoxのセレクトボックスの値をキーボードの左右で変更できる仕様に起因していると考えられます。
- 移動時に左右矢印キーのイベントを無効にする方法は存在しないため、別の解決策を模索する必要があります。
- ベストアンサー
JavaScriptのキーイベント
JavaScriptのキーイベント いつもお世話になりますm(__)m Javascriptのキーイベントで教えて下さい。 フォーム上に、テキストボックス(id=A)とセレクトボックス１(id=B)と、セレクトボックス２(id=C)があるフォームがあり、フォーム内の項目移動をキーボードで行いたいと思います。 各項目のkeydownイベントでキーコードを取得して、Aの場合 Enter(13)又は→(39)なら、Bへ ←(37)なら、Cへ 移動するようにキーコードを取得して移動するようにしました。 IEだと問題なく動くのですが、Firefoxだと、矢印キーで移動した時に、移動先のセレクトボックスの値が ←で動いた場合、セレクトボックスの値が1つ前 →で動いた場合、セレクトボックスの値が1つ後 に変わってしまいます。 (フォーカスは問題なく移動先のセレクトボックスにあります) 移動した後(例えばB.focus()の後)に、まだキーイベントが残っていて、Bにフォーカス移動後に、→キーが押されたような状態っぽいのです。 Firefoxの場合、セレクトボックスにフォーカスがある時、キーボードの左右で値を変更できるので、その辺りが原因と思うのですが、移動時に左右矢印キーのイベントを無効(?)にする事はできないのでしょうか？ 雑な書き方で申し訳ありませんが、お詳しい方、是非ともご教授下さいm(__)m 宜しくお願い致します。
- osaka-aq
- お礼率64% (41/64)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
イベントの無効化と伝播の抑止は、 IE以外の場合、 Event.preventDefault();とEvent.stopPropagation() です。 IEは、 event.returnValue = false;とevent.cancelBubble = true; ※eventというのは、IEだけにあるwindow.eventというオブジェクト名です。
その他の回答 (1)
- zeff
- ベストアンサー率69% (137/198)
＞フォーム内の項目移動をキーボードで行いたい と聞くと「tabindex」と「accesskey」でやるんじゃないの？ と思ってしまいましたが、違うのでしょうか。 javascriptじゃなくHTMLになりますけれども。 何かそういうjavasciprtの課題を解いているとかですか？
関連するQ&A
- JavaScriptのキーイベントについての質問です。
JavaScriptのキーイベントについての質問です。 フォーム上にテキストボックス、セレクトボックス、ボタンがあります。 それぞれの項目移動をキーボード（enter）で行いたいのですが、 テキストボックスからセレクトボックスへの移動は、 onkeydownとonblurにより、enter押下にて行えるのですが、 セレクトボックスからボタンへの移動が行えません。 これは可能なのでしょうか？ できればセレクトボックスにフォーカスされている時にenter押下で、ボタンを押すようにしたいです。 ブラウザはＩＥです。 どなたか是非ともご教示お願い致します。
- ベストアンサー
- JavaScript
- Flexでのキーイベント取得について
Flexでキーイベントを、 stage.addEventListener(KeyboardEvent.KEY_DOWN, イベント関数); こういう風に、stageにキーイベントを設けているのですが、 ウィンドウにフォーカスされてない時？などにイベントがとれません。 （ロード後やウィンドウをクリックした際は大丈夫です。） どうにか、ウィンドウにフォーカスされてない時でもキーイベント取得する方法はないのでしょうか？ できれば、flex内で処理したいのですが、javascriptでも構いません。 どなたかいい方法があればご回答を宜しく御願いします。
- 締切済み
- Flash
- キーイベントを擬似的に発生させることは可能？
JavaScriptのイベント処理で質問なのですが、 keydownなどのキーイベントを、実際にキーを押さずに擬似的に「このキーが押された」というイベントを発生させることは可能でしょうか？ そもそも不可能ではと思っているのですが もしそういうテクニックがあるのならと思い質問させていただきました。 また、JavaScriptでは無理だがFirefoxのアドオンなら可能といった情報があればぜひ教えていただきたいと思います。
- ベストアンサー
- JavaScript
- JavaScript テキストボックス キーイベント
JavaScript テキストボックス キーイベント こんにちは。趣味でプログラミングをしている者です。 タイマーを使って計算ドリルを作ったのですが、 特定のキーコードで正解かどうか判定する関数を呼び出そうとしたのですが、 テキストボックスにこたえを入力して、キーを押すたびに 「キーン」というような音が鳴るのですが、 その音は、どのような仕組みで鳴るのでしょうか？ また、音を鳴らさないようにする方法がありましたら、 教えていただけないでしょうか よろしくお願いします <html> <head> <script type="text/javascript"> function init() { document.attachEvent("onkeypress", KotaeAwase); } function KotaeAwase() { if( event.keyCode == 13) { var key = 1; var kotae = parseInt( document.Form1.kotae.value ); var Result = document.Form1.result; if( kotae == key ) Result.value = "せいかいです!"; else Result.value = "ちがいます"; } } </script> </head> <body onLoad="init();"> <form name="Form1"> <input type="text" name="kotae" size="20"> <br><br> <input type="text" name="result" size="20"> <br> </form> </body> </html>
- ベストアンサー
- JavaScript
- Accessでのキーイベントの処理について
Access2007のフォームのテキストボックスに指定のキーが押されると 「指定キーの処理」→「テキストボックスは指定キーが押される前の状態にする」 上記の動作をさせようとしているのですが、「指定キーの処理」は「キーイベントの処理」でうまく行ってるのですが、どうしてもテキストボックスに「今押したキー」が入力されてしまいます。 動作は １：キー'A'が押される ２：キーイベントの処理を実施→Private Subを実行 Private Sub TB1_KeyDown(KeyCode As Integer, Shift As Integer) TB1_Copy = Me![TB1] ～～～～～～～～～～～キーイベントに関する処理 ’省略 Me![TB1] = TB1_Copy End Sub 以上の様にしているのですが、テキストボックスに「今押したキー」が入力されてしまいます。 宜しくご指導下さい。
- ベストアンサー
- オフィス系ソフト
- C#のキーイベント取得
ASP.NET、C#でWebを開発しております。 ASP.NET 2.0,VssualStudio2005、です。 あるフォームでキー（例えばctlrキー）が、 押された場合に別のpageに飛ぶ。 ということをしたいのですが、 キーイベントはどうやって取得すればよいのでしょうか？ 情報が少なくてすみませんが、どなたかご教授お願い致します。
- ベストアンサー
- Microsoft ASP
- JavaScriptで次のような動作を実現したいと思います。
JavaScriptで次のような動作を実現したいと思います。 【状況】 テキストフォームが1つ、セレクトボックス（空白、選択肢a、選択肢b）が1つ、ラジオボタンが2つある状況。 【動作】 ラジオボタンＡを選択した場合は、テキストフォームもセレクトボックスも入力可能。 ラジオボタンＢを選択した場合は、テキストフォームおよびセレクトボックスがクリア（空白）され、かつdisableとなる。 動作自体はシンプルだと思うのですが、上手く作れません。 ご存知の方がいらっしゃいましたら教えていただけますでしょうか。 よろしくお願いします。
- ベストアンサー
- JavaScript
- JavaScriptでフォームへのフォーカス処理
PHP、XHTML、CSSで応募フォームの作成をしております。 PHPとHTMLは別ファイルで作成しており、PHPにアクセスしてそのPHPが指定されたテンプレートを読みにいくような流れとなっております。 HTMLもPHPも完成して、応募フォームとして一通り動くようになったのですが、新たにフォーカス機能を追加したいということになりました。 具体的には、応募フォームの一番最初のテキストエリアに、ページ読み込み時にフォーカスを当てたいという内容です。 そこで、フォーカス機能用のJavaScriptを別ファイルで新たに作成し、動きを確認してみたところ上手く動きません。 HTMLとJavaScriptのソースは下記の通りです。 ==================================================================== ■HTML(全て書くと長くなってしまうので、簡略させていただきます) <script type="text/javascript" src="$path_top_js/focus.js"></script> <body onLoad="Focus()"> </head> <form name="top" action="index.php" method="POST" onReset="return false;" onSubmit="return false;"> <input type="hidden" name="USER_ID" value="$USER_ID"> <INPUT size="20" type="text" name="USER_ID" value="$USER_ID" MAXLENGTH="10"> </form> </body> ■JavaScript(focus.js) function Focus(){ document.top.USER_ID.focus(); } ==================================================================== 「フォームのname="USER_ID"というテキストエリアにフォーカスを当てる」という内容になります。 なぜフォーカスが当たらないのか、原因は予想がつくのですが、どう解決していいのか分かりません。 多分、フォームの値を保持するために記述しているhiddenタグ <input type="hidden" name="USER_ID" value="$USER_ID"> にJavaScriptのフォーカスが当たってしまっているみたいです。(フォーカスが当たっていると思われるhiddenタグは見ることができません) 試しにhiddenタグを外してみたところ、JavaScriptで指定したテキストエリアにフォーカスが当たっていることを確認しました。 「応募フォーム」ということで、ページ遷移した際にもフォームに入力した値を保持しておくためにhiddenタグは外したくないのですが、フォーカス機能もちゃんと動くようにしたいと思っております。 解決方法が分かる方いらっしゃいましたら、ご教授の程お願い致します。
- ベストアンサー
- HTML
- tabキーによるfocusの当たり方を制御したい
こんにちは，よろしくお願いします。 formが設置してあるページで，tabキーを押すとfocusが移動しますが，この挙動が，ブラウザによって違うことに気づきました。 ドリームウィーバーで，レコードの挿入ウィザードを使って簡単にフォームを設置することができますが，たとえば，この単純なページをInternet Explorerで開いて，１回tabキーを押してみると，focusは，ブラウザのアドレスバーに行ってしまいます。しかし，Firefoxでは，フォームの１番目のテキストボックスにfocusが当てられ一番最後にブラウザのアドレスバーなどに行きます。また，OperaではFirefoxと同様にフォームの１番目のテキストから始まって，ブラウザにはfocusが渡りません。 FirefoxやOperaのようにフォームの１番目の項目からfocusがあたるようにしたいのですが，どのようにすればよいのでしょうか？ gooやYahooを上記の３つのブラウザで開いてみると，必ず同じ挙動を示して，同じところからfocusが当たりますから，何らかの方法で制御する方法があるのだと思うのですが…。 tabindexを設定して，フォームの１番目の項目を１として，順に設定してみたりしたのですが，Internet Explorerでは，やはり一番先にブラウザにfocusが渡ってしまいました。 私の希望としては，Opera のように一切ブラウザにfocusが当たらないようにしたいのです。しかし，できないのであれば，Internet Explorerで一番最初にブラウザにfocusが当たらないようにする方法を教えていただきたいです。 当方，JavaScriptとPHPにてホームページを作成中です。よろしくお願いします。
- ベストアンサー
- HTML
- Firefoxの拡張で擬似的にキーイベントを発生させる方法
Firefoxのアドオンで「Cycle Input Focus」というものがあります。 これは「Ctrl+Alt+C」でフォームのみカーソルを移動することができるアドオンで、 これをキーボードを使わずにボタンを拡張して「フォームのみカーソル移動」させたいのですが、 「Ctrl+Alt+C」のキーイベントを発生させる方法がわかりません。 var keyevent = document.createEvent("KeyEvents"); keyevent.initKeyEvent("keypress", false, true,document.defaultView, true, true, false, false, 0, 99); document.dispatchEvent(keyevent); これを使うとできるらしいのですが、どこが間違っているか教えてください。 keycode、charcodeは ttp://www.w3.org/2002/09/tests/keys-cancel2.html を利用してkeycode 0、charcode 99と出ました。
- 締切済み
- JavaScript
お礼
ご回答ありがとうございますm(__)m Event.stopPropagation()とevent.cancelBubble = true;は知りませんでした(^-^;) しかし、それを入れても、やはりFirefoxだとキーイベントが残っている(伝播している？)みたいで、ダメでした(>_<) 私の考えている事は根本的に無理なのかもしれませんね。。。 ありがとうございましたm(__)m また何かの際は、宜しくお願い致します。