25

私は次のマークアップを持っています：

<input type="number" max="99" />

Google Chrome（および場合によっては他のWebkitブラウザー）では、これによりスピナーの上矢印が99を超えるのを制限しますが、ユーザーが99より大きい数値を入力するのを妨げることはありません。onblurでも、無効な値は削除/置換されません。値が無効であることを示す警告ですら。

私はそれがどのように機能するのかを誤解していますか、それともこれはバグですか？最新バージョンのChrome（執筆時点では19）を使用しています。

編集：

明確にするために、最初に指定された最大値より大きい数を入力できる理由を知りたいです。フォーム送信のツールチップが無効であることを示していることは理解していますが、スピナーが最大値を超えることを許可しないという一貫性のない動作のようですが、いつでも最大値を超える数値を入力するだけで回避できますそれ。

これが何らかの理由で望ましい動作である場合、それはなぜですか？そして、JSに頼らずに入力範囲を強制するためのより良いオプションはありますか？

4

2 に答える 2

9

動作しますが、送信ボタンとフォームをコードに挿入した場合にのみエラーメッセージ（ツールチップ）が表示されます。

<form action="#" method="get">
  <input type="number" max="99" />
  <input type="submit" value="Submit!" />
</form>

jsFiddle </ p>

于 2012-05-25T16:13:55.353 に答える
2

古い質問ですが、この質問に関連する回答はどこにも見つかりませんでした。この動作はまだクロム（バージョン61）で行われています。

ある状況で使用できるちょっとしたトリックを見つけました。aureliaこれは、などのデータバインディングライブラリを使用する人に関係がありangularます。私はaureliaでのみテストしましたが、他の人にも機能するはずです。

このトリックは、タイプの入力が/制約をrange適用するという事実に依存しています。minmax

range通常の入力と同じ値にバインドされた（タイプの）別の入力を作成し、を介して非表示にしcssます。

ユーザーが値より大きいものを入力すると、max値にスナップバックしmaxます。

これがaureliaのデモです：https ：//gist.run/？id = 86fc278d3837718be4691acd5625aaad

于 2017-10-16T19:06:36.357 に答える