コンテンツにスキップ

HTML Living Standard/enterkeyhint属性

出典: フリー教科書『ウィキブックス(Wikibooks)』

enterkeyhint属性

[編集]

enterkeyhint属性は、仮想キーボードに表示されるEnterキーのラベルを制御するためのHTML属性です。この属性を使用すると、モバイル端末などの仮想キーボードでユーザーインターフェースをカスタマイズし、入力フィールドの文脈に応じた適切なラベルを表示することができます。

基本構文

[編集]
<input type="text" enterkeyhint="next">
  • input: 属性を適用するHTML要素。
  • enterkeyhint: 仮想キーボードのEnterキーに表示されるラベルを制御します。

有効な値

[編集]
  • enter
    仮想キーボードのEnterキーに「Enter」と表示します。通常、フォームの送信や次の操作に使用されます。
  • done
    仮想キーボードのEnterキーに「完了」や「終了」などと表示され、フォームの入力が完了したことを示します。
  • go
    仮想キーボードのEnterキーに「進む」や「検索」などと表示され、特定のアクション(例えば検索の開始)を示します。
  • next
    仮想キーボードのEnterキーに「次へ」と表示され、次の入力フィールドに移動するために使用されます。
  • previous
    仮想キーボードのEnterキーに「前へ」と表示され、前の入力フィールドに戻るために使用されます。
  • search
    仮想キーボードのEnterキーに「検索」と表示され、検索機能をトリガーするために使用されます。
  • send
    仮想キーボードのEnterキーに「送信」と表示され、特にメッセージングやフォーム送信時に使用されます。

使用例

[編集]
次のフィールドへの移動
<input type="text" enterkeyhint="next" placeholder="次のフィールドへ">

この例では、仮想キーボードのEnterキーに「次」が表示され、ユーザーが次の入力フィールドに移動できるようになります。

動作の概要

[編集]
  • Enterキーのラベル変更:
    • 仮想キーボードのEnterキーに表示されるラベルを変更することで、ユーザーインターフェースを直感的にカスタマイズできます。
  • 入力フィールドの体験向上:
    • ユーザーの入力体験を向上させ、次のフィールドに進む、送信する、検索を開始するなどのアクションを明確にします。

enterkeyhint属性の利用シーン

[編集]
  • フォーム入力の補助:
    • 入力フォームにおいて、次のフィールドに進む、送信する、または検索を開始するなどのアクションを明確にするために使用されます。
  • チャットボットやメッセージングアプリ:
    • ユーザーがメッセージを送信するためのラベルとして「送信」などを表示することで、仮想キーボードをカスタマイズできます。
  • 検索機能の強化:
    • 検索フィールドに「検索」のラベルを表示することで、ユーザーが直感的に検索を開始できるようにします。

注意点

[編集]
  • ブラウザのサポート状況:
    • この属性は主にモバイルブラウザでの仮想キーボードに影響を与えますが、すべてのブラウザがサポートしているわけではありません。特にデスクトップ環境では動作しないことがあります。
  • 仮想キーボードのカスタマイズ:
    • 仮想キーボードの挙動はデバイスやブラウザに依存するため、すべての端末で一貫した挙動を保証することはできません。

互換性

[編集]
互換性
ブラウザ サポート状況
Chrome 対応
Edge 対応
Firefox 対応
Safari 対応
Opera 対応

参考文献

[編集]

関連項目

[編集]