Theo html5.org , thuộc tính giá trị "kiểu số", nếu được chỉ định và không trống, phải có giá trị là số dấu phẩy động hợp lệ. "
Tuy nhiên, đơn giản là (trong phiên bản mới nhất của Chrome, dù sao), một điều khiển "cập nhật" với số nguyên, không nổi:
<input type="number" id="totalAmt"></input>Có phần tử đầu vào dấu phẩy động nào có nguồn gốc từ HTML5 hay cách để làm cho kiểu đầu vào số hoạt động với số float chứ không phải ints? Hoặc tôi phải dùng đến một plugin UI UI?
Câu trả lời:
Các numberloại có một stepgiá trị kiểm soát mà con số này là hợp lệ (cùng với maxvà min), mặc định là 1. Giá trị này cũng được sử dụng bởi các cài đặt cho các nút bước (tức là nhấn lên tăng theo step).
Đơn giản chỉ cần thay đổi giá trị này thành bất cứ điều gì là phù hợp. Đối với tiền, hai vị trí thập phân có thể được dự kiến:
<input type="number" step="0.01">(Tôi cũng đặt min=0nếu nó chỉ có thể tích cực)
Nếu bạn muốn cho phép bất kỳ số vị trí thập phân nào, bạn có thể sử dụng step="any"(mặc dù đối với tiền tệ, tôi khuyên bạn nên sử dụng 0.01). Trong Chrome & Firefox, các nút bước sẽ tăng / giảm 1 khi sử dụng any. (cảm ơn câu trả lời của Michal Stefanow đã chỉ ra anyvà xem thông số kỹ thuật có liên quan ở đây )
Đây là một sân chơi cho thấy các bước khác nhau ảnh hưởng đến các loại đầu vào khác nhau như thế nào:
<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>Như thường lệ, tôi sẽ thêm một ghi chú nhanh: hãy nhớ rằng xác thực phía máy khách chỉ là sự tiện lợi cho người dùng. Bạn cũng phải xác nhận về phía máy chủ!
Qua: http://blog.isotoma.com/2012/03/html5-input-typenumber-and-decimalsfloats-in-chrom/
Nhưng nếu bạn muốn tất cả các số là hợp lệ, số nguyên và số thập phân giống nhau thì sao? Trong trường hợp này, hãy đặt bước tới bất kỳ người nào
<input type="number" step="any" />Hoạt động với tôi trong Chrome, không được thử nghiệm trong các trình duyệt khác.
Bạn có thể dùng:
<input type="number" step="any" min="0" max="100" value="22.33">Bạn có thể sử dụng thuộc tính bước cho số loại đầu vào:
<input type="number" id="totalAmt" step="0.1"></input>step="any"sẽ cho phép bất kỳ số thập phân.
step="1"sẽ không cho phép số thập phân.
step="0.5"sẽ cho phép 0,5; 1; 1,5; ...
step="0.1"sẽ cho phép 0,1; 0,2; 0,3; 0,4; ...
Dựa trên câu trả lời này
<input type="text" id="sno" placeholder="Only float with dot !"
onkeypress="return (event.charCode >= 48 && event.charCode <= 57) ||
event.charCode == 46 || event.charCode == 0 ">Ý nghĩa :
Mã Char:
0, 1, 2, 3, 4, 5, 6, 7, 8, 9Backspace(nếu không cần trang làm mới trên Firefox)dot&&là AND, ||là ORtoán tử.
nếu bạn thử thả nổi bằng dấu phẩy:
<input type="text" id="sno" placeholder="Only float with comma !"
onkeypress="return (event.charCode >= 48 && event.charCode <= 57) ||
event.charCode == 44 || event.charCode == 0 ">Chromium và Firefox được hỗ trợ (Linux X64) (các trình duyệt khác tôi không tồn tại.)
Tôi chỉ có cùng một vấn đề, và tôi có thể sửa chữa nó bằng cách chỉ đặt một dấu phẩy và không phải là một khoảng thời gian / full stop trong số vì nội địa hóa Pháp .
Vì vậy, nó hoạt động với:
2 là ổn
2,5 là OK
2.5 là KO (Số được coi là "bất hợp pháp" và bạn nhận được giá trị trống).