【Foundation6】ドロップダウン内のフォームがEnterでsubmitできない

enterkey

Foundation6のドロップダウン内コンテンツに検索フォームを設置したのですが、Enterキーで送信できないという問題に遭遇しました。

Dropdownの解説はこちら

ボタンのクリックでなら送信できますが、パソコンを使い慣れたユーザーには不便な仕様ですね。

改善法を調べましたので参考にしてみてください。

AD

Enterでsubmitできない例

ドロップダウン内にフォームを設置したものの、入力後Enterでsubmitできません。
ボタン(デモでは「submit」というボタン)をクリックすれば送信はできますが、不便ですね。

false
送信できない例です。
デモページを見る

Enterでsubmitできるようにする

Foundation6のドロップダウンメニューは、Enterで開閉されるようにキーバインドが設定されています。
この設定がEnterでのフォーム送信と競合していますので、キーバインドを上書きします。

foundation()の実行後に

と記述します。

success
上記の設定を加えた例です。
デモページを見る

AD

Share

Commentsコメント

メールアドレスは公開されません。コメントは必ずご入力ください。

HTMLタグは使用できません。ソースコードを書き込みたい場合はCodetterGistCodePenなどのご利用が便利です。

コメントはまだありません。