HTML5에 부동 입력 유형이 있습니까?

HTML5에 부동 입력 유형이 있습니까?

---

html5.org 에 따르면 "숫자"입력 유형의 "값 속성이 지정되고 비어 있지 않은 경우 유효한 부동 소수점 숫자 인 값을 가져야합니다."

그러나 이것은 단순히 (최신 버전의 Chrome에서) 부동이 아닌 정수를 사용하는 "업다운"컨트롤입니다.

<input type="number" id="totalAmt"></input>

HTML5 고유의 부동 소수점 입력 요소가 있습니까? 아니면 숫자 입력 유형이 정수가 아닌 부동 소수점과 함께 작동하도록 만드는 방법이 있습니까? 아니면 jQuery UI 플러그인을 사용해야합니까?

---

number유형은 갖는 step(함께 유효 숫자되는 제어 값 max과 min), 디폴트는 1. 이 값은 스테퍼 버튼 구현에서도 사용됩니다 (예 : 위로 누르면 씩 증가 step).

이 값을 적절한 값으로 변경하기 만하면됩니다. 돈의 경우 소수점 이하 두 자리가 예상됩니다.

<input type="number" step="0.01">

( min=0긍정적일 수만 있다면 설정하겠습니다 )

소수 자릿수를 허용하려면 사용할 수 있습니다 step="any"(통화의 경우를 고수하는 것이 좋습니다 0.01). Chrome 및 Firefox에서 스테퍼 버튼은를 사용할 때 1 씩 증가 / 감소합니다 any. (지적 마이클 Stefanow의 대답에 감사 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>

---

평소와 같이 간단한 메모를 추가 할 것입니다. 클라이언트 측 유효성 검사는 사용자의 편의에 불과하다는 점을 기억하십시오. 서버 측에서도 유효성을 검사해야합니다!

---

통해 : http://blog.isotoma.com/2012/03/html5-input-typenumber-and-decimalsfloats-in-chrome/

그러나 모든 숫자가 유효하고 정수와 소수가 동일하도록하려면 어떻게해야할까요? 이 경우 단계를 "any"로 설정하십시오.

<input type="number" step="any" />

---

Chrome에서 작동하며 다른 브라우저에서는 테스트되지 않았습니다.

---

당신이 사용할 수있는:

<input type="number" step="any" min="0" max="100" value="22.33">

도움을 희망, 안부

---

이 답변을 바탕으로

<input type="text" id="sno" placeholder="Only float with dot !"   
   onkeypress="return (event.charCode >= 48 && event.charCode <= 57) ||  
   event.charCode == 46 || event.charCode == 0 ">

의미 :

Char 코드 :

• 48-57 = 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
• 0은 Backspace(그렇지 않으면 Firefox에서 페이지 새로 고침이 필요함)
• 46은 dot

&&is AND, ||is OR연산자.

쉼표로 부동을 시도하면 :

<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 및 Firefox (Linux X64) (다른 브라우저는 존재하지 않습니다.)

---

입력 유형 번호에 단계 속성을 사용할 수 있습니다.

<input type="number" id="totalAmt" step="0.1"></input>

step="any" will allow any decimal.
step="1" will allow no decimal.
step="0.5" will allow 0.5; 1; 1.5; ...
step="0.1" will allow 0.1; 0.2; 0.3; 0.4; ...

---

I do so

 <input id="relacionac" name="relacionac" type="number" min="0.4" max="0.7" placeholder="0,40-0,70" class="form-control input-md" step="0.01">

then, I define min in 0.4 and max in 0.7 with step 0.01: 0.4, 0.41, 0,42 ... 0.7

---

I just had the same problem, and I could fix it by just putting a comma and not a period/full stop in the number because of French localization.

So it works with:

2 is OK

2,5 is OK

2.5 is KO (The number is considered "illegal" and you receive empty value).

참고URL : https://stackoverflow.com/questions/19011861/is-there-a-float-input-type-in-html5