[解決済み] JavascriptでEnterキーを押すとTabのような動作をする。
2023-08-22 13:33:22
質問
Enter キーを押すとページ上の "next" form 要素にフォーカスが移動するようなフォームを作成したいと思っています。私が Web 上で見つけ続けている解決策は...
<body onkeydown="if(event.keyCode==13){event.keyCode=9; return event.keyCode}">
残念ながら、それはIEで動作するように見えるだけです。この質問の真意は、FFとChromeで動作する解決策を知っている人がいれば教えてください。加えて、私はむしろ、FFとChromeのために onkeydown イベントを追加する必要はありませんが、それが唯一の方法である場合、それを行う必要があります。
この問題は 質問 905222 に似ていますが、私の意見では、それ自身の質問に値します。
編集:また、ユーザーが慣れているフォームの動作から乖離しているので、これは良いスタイルではないという問題を提起する人を見ました。私もそう思います! これはクライアントの要望です :(
どのように解決するのですか?
私は非常に効果的であるアンドリューによって提案されたロジックを使用しています。そしてこれが私のバージョンです。
$('body').on('keydown', 'input, select', function(e) {
if (e.key === "Enter") {
var self = $(this), form = self.parents('form:eq(0)'), focusable, next;
focusable = form.find('input,a,select,button,textarea').filter(':visible');
next = focusable.eq(focusable.index(this)+1);
if (next.length) {
next.focus();
} else {
form.submit();
}
return false;
}
});
KeyboardEventのキーコード(すなわち
e.keycode
) 減価償却費のお知らせ :-)
https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode
関連
-
[解決済み] JavaScriptのオブジェクトにキーが存在するかどうかをチェックする?
-
[解決済み] JavaScriptのオブジェクトにキーと値のペアを追加するにはどうすればよいですか?
-
[解決済み] フォーム送信のようなJavaScriptのポストリクエスト
-
[解決済み] テキストボックスのEnterキーで、JavaScriptでボタンクリックをトリガーする
-
[解決済み] JavaScriptには、与えられた範囲内の範囲を生成する "range() "のようなメソッドがありますか?
-
[解決済み] Enterキーが押されたときにフォームを送信しないようにする
-
[解決済み] モバイルWeb HTML5フレームワークの選び方【終了しました
-
[解決済み] javascript の関数から `undefined` と `null` のどちらを返すのが良いのでしょうか?
-
[解決済み] Chromeの拡張機能開発にWebStormを使用するにはどうすればよいですか?
-
[解決済み] CORS: 認証モードは 'include' です。
最新
-
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 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Enterキーが押されたときにフォームを送信しないようにする
-
[解決済み] タブインデックスで次の要素にフォーカスする
-
[解決済み] jqueryでdivの要素がオーバーフローしていないかチェックする
-
[解決済み] WebStormで未解決の変数が大量にある場合の警告に対処する方法は?
-
[解決済み] 文字列が空白であるかどうかをチェックする
-
[解決済み] 文字列がhtmlであるかどうかをチェックする
-
[解決済み] JavaScriptのtoString()関数をオーバーライドして、デバッグ用に意味のある出力を提供することは可能でしょうか?
-
[解決済み] サブドメインにまたがってlocalStorageを使用する
-
[解決済み] Javascriptで動的に命名されたメソッドを呼び出すにはどうすればよいですか?
-
[解決済み] JavaScript で `throw` の後に `return` をする必要がありますか?