質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.44%
HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

1回答

1816閲覧

html 24時間を超える時間の表示、入力

matukouct

総合スコア1

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

1グッド

1クリップ

投稿2023/05/17 00:44

編集2023/05/17 09:11

実現したいこと

htmlでTimePickerのようなコントロールを使用して
24時間を超える時間の表示、入力を実現できたらと考えています。

前提

・javaのコントロールからthymeleafを使用して時間を設定。
時間はDBより取得し、表示する。
24時間を超える場合があり、その場合はそのまま「25:30」のように表示したい。
・できるだけ操作を簡単にしたいため、TimePickerのように直接入力ではなく、
上下ボタンで選択できるようなコントロールを使用したい。

発生している問題・エラーメッセージ

現状、input type="number"を使用するしかないのかなと思っていますが、
もし24時間以上の初期表示、入力が可能なコントロールがあったら教えてほしいです。
また、他にも比較的簡単に実現できる方法があれば教えてほしいです。

該当のソースコード

環境は以下です。
・java spring boot
・htmlの値の設定・取得はthymeleafを使用しています。

試したこと

以下の機能については試してみましたが、表示、入力できる時間は23:59まででした。
・htmlのinput type="time"
・jquery timepicker
・jquery timeEntry (オプションによって24時間以上の入力はできるが、初期表示できない)

補足情報(FW/ツールのバージョンなど)

html : HTML5
java : 17

shinoharat👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

jimbe

2023/05/17 04:24

タイトル、"表示"では無く"入力"のほうが良いのではないでしょうか。
matukouct

2023/05/17 09:12

タイトルを修正しました。 入力もそうですが、初期表示もできないので両方タイトルに記載させて頂きました。
shinoharat

2023/05/23 05:09 編集

「目覚ましが鳴るのは午前1時30分です」みたいな特定の時刻を「25:30」と表示したいのでしょうか? それとも、「目覚ましが鳴るまで、残り25時間30分です」みたいな時間の長さを表示したいのでしょうか? 後者であれば、 `timespan` や `duration` などのワードでググれば、情報が見つかるかもしれません。 以下のサイトで「html-duration-picker.js」「DurationPickerMaker」などのライブラリが紹介されていますので、もしかしたら要件に合うものがあるかもしれません。 https://www.jqueryscript.net/blog/best-duration-picker.html
matukouct

2023/05/24 01:04

ご回答ありがとうございます。 前者のように翌日の1:30を25:30のように表示したいと考えています。 教えて頂いたサイト参考に探してみます。ありがとうございます。
guest

回答1

0

ベストアンサー

html-duration-picker が良いかと思います。

時分のみ(秒を非表示)にしたい場合は「data-hide-seconds」オプションが使えます。

https://nadchif.github.io/html-duration-picker.js/

投稿2023/05/23 05:40

編集2023/05/23 06:23
shinoharat

総合スコア1685

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

matukouct

2023/05/24 01:06

まさに探していたものでした! ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.44%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問