[解決済み] HTML5でfloat入力タイプはありますか?
質問
によると html5.org 入力タイプの "number" の "value 属性が指定されていて空ではない場合、有効な浮動小数点数である値を持つ必要があります。
しかし、これは(Chromeの最新バージョンでは)単純に、浮動小数点ではなく整数の"updown"コントロールなのです。
<input type="number" id="totalAmt"></input>
HTML5 にネイティブな浮動小数点入力要素、または数値入力タイプを int ではなく浮動小数点数で動作させる方法はありますか?それとも、jQuery UIプラグインに頼らなければならないのでしょうか?
どのように解決するのですか?
その
number
タイプには
step
の値は、どの数字が有効かを制御します。
max
と
min
) にデフォルトで設定されます。
1
. この値は、ステッパーボタンの実装でも使用されます(例:上を押すと
step
).
この値を適当なものに変更すればよい。お金の場合は、小数点以下2桁が期待されるでしょう。
<input type="number" step="0.01">
(私なら、さらに
min=0
正でなければならない場合)
小数点以下の桁数を任意に設定したい場合は
step="any"
(ただし、通貨の場合、私は
0.01
). Chrome & Firefoxでは、ステッパーボタンは、以下のように1ずつ増加/減少します。
any
. (ミハエル・ステファノフさんの回答で
any
、および
関連する仕様はこちらをご覧ください
)
ここでは、さまざまなステップがさまざまな入力タイプにどのように影響するかを示すプレイグラウンドを紹介します。
<form>
<input type=number step=1 /> Step 1 (default)<br />
<input type=number step=0.01 /> Step 0.01<br />
<input type=number step=any /> Step any<br />
<input type=range step=20 /> Step 20<br />
<input type=datetime-local step=60 /> Step 60 (default)<br />
<input type=datetime-local step=1 /> Step 1<br />
<input type=datetime-local step=any /> Step any<br />
<input type=datetime-local step=0.001 /> Step 0.001<br />
<input type=datetime-local step=3600 /> Step 3600 (1 hour)<br />
<input type=datetime-local step=86400 /> Step 86400 (1 day)<br />
<input type=datetime-local step=70 /> Step 70 (1 min, 10 sec)<br />
</form>
いつものように簡単に補足しておくと、クライアントサイドの検証はユーザーの利便性を高めるだけだということを覚えておいてください。サーバーサイドでの検証も必要です!
関連
-
[解決済み] Webフォームのフィールド/入力タグでブラウザのオートコンプリートを無効にするにはどうすればよいですか?
-
[解決済み] HTML5のlocalStorageにオブジェクトを格納する方法は?
-
[解決済み] 文字列をfloatやintにパースするにはどうしたらいいですか?
-
[解決済み] .NETでのdecimal, float, doubleの違い?
-
[解決済み] 文字列が数値(float)であるかどうかを確認するにはどうすればよいですか?
-
[解決済み] ngModel' は 'input' の既知のプロパティではないため、バインドできません。
-
[解決済み] <button> vs. <input type="button" />. Which to use?
-
[解決済み] input type="date "のフォーマットを変更する方法はありますか?
-
[解決済み] Zalgoテキストはどのように機能しますか?
-
[解決済み】HTML5入力のプレースホルダの色をCSSで変更する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Uncaught TypeError: document.getElementsById は関数ではありません。
-
[解決済み] リンクのように動作するHTMLボタンを作成する方法
-
[解決済み] HTML 5: Is it <br>, <br/>, or <br />?
-
[解決済み] inline/inline-block要素間のスペースを削除するにはどうすればよいですか?
-
[解決済み] HTML5の数値入力のスピンボックスを非表示にすることはできますか?
-
[解決済み] CSSコンテンツによるHTMLエンティティの追加
-
[解決済み] div内の要素を縦に並べるにはどうしたらいいですか?
-
[解決済み] <input type="number"> に小数点以下2桁の数字を入力できるようにする。
-
[解決済み】HTMLのテキスト入力で数値入力しかできない。
-
[解決済み] JavaScriptでCtrl+V, Ctrl+Cを検出するには?