如何調整<input>元素的時間格式（12小時製或24小時制）？
P粉488464731
2023-08-20 18:47:36
<p>我正在使用帶有<code>type=time</code>的HTML5輸入元素。問題是它顯示的時間是<code>12小時制</code>，但我希望它以<code>24小時制</code>顯示。我該如何將其設定為24小時制？ </p>
<p>這是我的輸入欄位：</p>
<p><br /></p>
<pre class="brush:html;toolbar:false;"><input type="time" name="time" placeholder="小時:分鐘" pattern="^([0-1]?[0 -9]|2[0-4]):([0-5][0-9])(:[0-5][0-9])?$" class="inputs time" required>< /pre>
<p><br /></p>
根據HTML5草案，
input type=time建立了一個用於輸入一天中時間的控件，預計將使用「使用者首選的顯示方式」來實現。但實際上，這意味著使用遵循瀏覽器本地化規則的小部件。因此，不論周遭內容的語言是什麼，顯示方式都會根據瀏覽器的語言、底層作業系統的語言或系統範圍的區域設定（取決於瀏覽器）而改變。例如，使用芬蘭語版本的Chrome瀏覽器，我看到的小工具使用標準的24小時制。你的情況可能會有所不同。因此，
input type=time是基於將本地化的想法完全交給頁面作者之外的方法。這是有意的；在HTML5討論中，這個問題已經提出了幾次，結果都是沒有改變（除了可能對文本進行了澄清，將此行為描述為預期的行為）。請注意，
input type=time不允許使用pattern和placeholder屬性。而且，如果實現了placeholder="hrs:mins"，可能會產生誤導。當瀏覽器的語言環境使用「.」作為時間分隔符號時，使用者可能需要輸入12.30（使用句點），而不是12:30。我的結論是，在不支援
pattern屬性的瀏覽器上，應該使用input type=text，並使用一些JavaScript來檢查輸入的正確性。HTML5時間輸入
這是與日期/時間相關類型中最簡單的一種，允許使用者在24/12小時制的時鐘上選擇時間，通常取決於使用者的作業系統區域設定。傳回的值以24小時的
小時:分鐘格式，看起來類似14:30。更多詳細信息，包括每個瀏覽器的外觀，可以在MDN上找到。