집 > 기사 > 웹 프론트엔드 > 숫자만 입력할 수 있도록 html5에서 입력을 설정하는 방법

숫자만 입력할 수 있도록 html5에서 입력을 설정하는 방법

青灯夜游원래의: 2021-09-13 16:09:5316447검색

HTML5에서는 입력 태그의 type 속성을 사용하여 숫자만 입력하는 기능을 구현할 수 있습니다. type 속성의 값을 "number"로 설정하기만 하면 됩니다. 구문은 ""

이 튜토리얼의 운영 환경: Windows 7 시스템, HTML5 버전, Dell G3 컴퓨터.

태그는 사용자가 데이터를 입력할 수 있는 입력 필드를 지정합니다.

유형 속성에 따라 입력 필드의 형태가 다양합니다. 입력 필드는 텍스트 필드, 체크박스, 비밀번호 필드, 라디오 버튼, 버튼 등이 될 수 있습니다.

입력을 숫자만 입력하도록 설정하려면 유형 속성의 값을 "숫자"로 설정하기만 하면 됩니다.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<input placeholder="文本,字母,数字等都可输入"/><br /><br />
		<input type="number" placeholder="只能输入数字"/>
	</body>
</html>

출력 결과:

숫자만 입력할 수 있도록 html5에서 입력을 설정하는 방법

추가: 입력 요소의 유형 --type 속성은 값

값	설명
버튼	을 설정할 수 있습니다. 클릭 가능한 버튼을 정의합니다(일반적으로 스크립트를 실행하기 위해 JavaScript와 함께 사용됨).
checkbox	체크박스를 정의하세요.
color	색상 선택기를 정의합니다.
date	날짜 제어를 정의합니다(연도, 월, 일 포함, 시간 제외).
datetime	날짜 및 시간 제어를 정의합니다(UTC 시간대를 기준으로 연도, 월, 일, 시, 분, 초, 1초 미만 포함).
datetime-local	날짜 및 시간 제어를 정의합니다(연도, 월, 일, 시, 분, 초, 1초 미만, 시간대 제외).
email	이메일 주소에 사용되는 필드를 정의합니다.
file	파일 선택 필드를 정의하고 파일 업로드를 위한 "찾아보기..." 버튼을 정의하세요.
hidden	숨겨진 입력 필드를 정의하세요.
image	이미지를 제출 버튼으로 정의합니다.
month	월 및 연도 컨트롤을 정의합니다(시간대 제외).
number	숫자 입력 필드를 정의합니다.
password	비밀번호 필드를 정의합니다(필드의 문자는 마스크됩니다).
radio	라디오 버튼을 정의하세요.
range	정확한 값이 중요하지 않은 입력 숫자에 대한 컨트롤을 정의합니다(예: 슬라이더 컨트롤).
reset	재설정 버튼 정의(모든 양식 값을 기본값으로 재설정).
search	검색 문자열을 입력하기 위한 텍스트 필드를 정의하세요.
submit	제출 버튼을 정의하세요.
tel	전화번호 입력 필드를 정의합니다.
text	기본값. 한 줄 텍스트 필드를 정의합니다(기본 너비는 20자).
time	시간 입력에 대한 컨트롤을 정의합니다(시간대 제외).
url	URL 입력 필드를 정의합니다.
week	주 및 연도 제어를 정의합니다(시간대 제외).

추천 튜토리얼: "html 비디오 튜토리얼"

위 내용은 숫자만 입력할 수 있도록 html5에서 입력을 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

JavaScript html5 html checkbox date mail 字符串 number input

성명：

이전 기사：HTML에서 올바른 정렬을 얻는 방법다음 기사：HTML에서 올바른 정렬을 얻는 방법