【jquery】エンターが押された時に処理を行う、その後スマホのキーボードを閉じるや〜つ

Tips Web

軽〜い備忘録です。

検索ボックスやフォームをスマホやPCで入力してもらう時に、エンター(Returnキー)やスマホの検索や表示ボタンを押すと処理を実行したり、情報を送信したりしたかったので色々調べました。

エンターを無効にする記事がほとんどで探すのに苦労しましたが、意外と簡単にできました。

すぐ終わりますww

スポンサードリンク

【jquery】エンターが押された時に処理を行い、その後スマホのキーボードを閉じる方法

とりあえずhtmlはざっくりこれで
*本当はこれに色々付け足してますが長いし、この記事はjqueryがメインなので、、、


<form action="#">
	<input id="sample" type="text">
	<button type="submit"></button>
</form>

formタグにはaction=”#”を入れないとスマホ(IOS)で青い検索ボタンではなく改行ボタンが表示されるので注意です。


// エンターキーで以下を処理する
$( '#sample' ).keypress( function ( e ) {
  if ( e.which == 13 ) {
  // ここに処理を書く

// スマホのキーボードを閉じる
  $("#sample").blur();
   return false;
}
})

これを必要に応じて適切な場所に配置してくださいませ。

スマホのキーボードを閉じるやつが無いと、入力した後にもキーボードが表示され続けます。

邪魔な場合は.blur()でキーボードを閉じましょう(^^)/

では〜

Webのコトでお困りの方

ホームページの制作・修正・リニューアル等のお手伝い致します!!詳細はこちら

まずは下のリンクから気軽にご相談ください^ ^

SNSからのDMの方が早くレスポンスできます。