Q&A
動作確認をされたブラウザとそのバージョンをご提示ください。
質問内容
タイトルの通り、5分刻みの時刻入力欄を作成したいです。
試したこと
inputタグの type="time" で step="300" としました。
キーボードの上下カーソルでの増減では５分単位で時刻が切り替わるのですが、時計アイコンをクリックした時に表示される選択欄では５分単位で表示されませんでした。
時計アイコンの選択欄の表示は変えることができないのでしょうか？
動作環境
ブラウザ ： Google Chrome
バージョン：93.0.4577.82（Official Build） （x86_64）
chromeです。
バージョンは 93.0.4577.82（Official Build） （x86_64）です。
ご返答ありがとうございます。
ただ、この欄は、質問への追記・修正の為のものとなりますので、お手数ですが、情報などの追加に関しては、質問文を編集して、追記していただきますようお願いいたします。
>1分刻みのまま
とのことですが、同バージョンのChromeにて、step="300"を指定した場合、キーボードの上下カーソルでの増減は、5分単位となりました。
また、1分単位の入力は可能ですが、送信時にエラーとなります。
Kino104さんの「1分刻みのまま」は、正確にはどのような状況なのか、ご提示ください。
もう一度試したところ、キーボードの上下カーソルでの増減は5分単位で表示されていました。
私の勘違いだったようです。申し訳ありません。
回答2件
0
ベストアンサー
step属性でユーザ入力の制限までかかるかどうかはブラウザの実装次第なので、期待通り動かなければ仕方ありません。
select2つなどで代用するのはいかがでしょうか。
html
1<select name="hour"> 2<option>00</option> 3... 4<option>23</option> 5</select> 6 7<select name="minutes"> 8<option>00</option> 9<option>05</option> 10... 11<option>55</option> 12</select>
投稿2021/09/21 01:32
編集2021/09/21 01:32
総合スコア21695
0
ブラウザの実装によります。
ブラウザによってはstepは秒刻みか分刻みかの切り替え用に
60しか設定が有効ではないものもあるようです
どうしてもという場合はnumberで代用を検討ください
HTML
1<input type="number" min="0" max="23" size="2">: 2<input type="number" min="0" max="55" size="2" step="5">
投稿2021/09/21 01:19
編集2021/09/21 01:50
総合スコア116724
あなたの回答
tips
プレビュー
