>웹 프론트엔드 >JS 튜토리얼 >layDate 구성 요소를 통해 날짜/시간 선택기를 만드는 방법

layDate 구성 요소를 통해 날짜/시간 선택기를 만드는 방법

清浅
清浅원래의
2019-01-18 14:29:533417검색

layDate 구성 요소를 통해 날짜 및 시간 선택기를 만드는 방법: 먼저 공식 웹사이트에서layDate 구성 요소를 다운로드한 다음 외부에서laydatejs 파일을 가져온 다음 마지막으로 메서드를 직접 호출하여 날짜 및 시간 선택기 효과를 완성합니다.

layDate 구성 요소를 통해 날짜/시간 선택기를 만드는 방법

이 문서의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

먼저 공식 홈페이지에서layDate 컴포넌트를 다운로드한 후 외부에서laydatejs 파일을 도입하고 마지막으로 메소드를 직접 호출하여 날짜 및 시간 선택기 효과를 완성합니다

대부분의 브라우저에서는 날짜 및 시간 선택기 컨트롤이 날짜를 표시합니다. 브라우저 기본 날짜 및 시간 선택기와 함께 제공되는 시간 선택기 컨트롤입니다. 즉, 사용자가 브라우저를 탐색할 때 다른 날짜 및 시간 선택 도구가 표시됩니다. 오늘 여러분께 전해드릴 내용은 날짜 선택기 효과 제작 사례입니다

layDate 날짜 및 시간 컴포넌트

layDate 그룹은 Layui가 독립적으로 관리하는 3가지 컴포넌트 중 하나로 연도 선택기, 연도 및 월 선택기, 선택 방법은 날짜 선택기, 시간 선택기, 날짜 시간 선택기의 5가지 유형이 있으며 범위 선택 모두 지원합니다

(1)layDate 컴포넌트 다운로드

다운로드 주소:https://www.layui.com/ laydate/

layDate 구성 요소를 통해 날짜/시간 선택기를 만드는 방법

(2)laydate.js 파일에 대한 외부 참조

<script src="./layDate-v5.0.9/laydate/laydate.js"></script>

(3) 프로그램 코드

<body>
	<input type="text" id="text">
	<input type="text" id="text1">
	<script>
		laydate.render({
			elem:"#text",
			type:"date",
			theme:"#CD318E"
		});
		
		laydate.render({
			elem:"#text1",
			type:"time",
			theme: "#ccc"
		});
	</script>
</body>

Rendering:

layDate 구성 요소를 통해 날짜/시간 선택기를 만드는 방법

요약: 다음은 간단한 날짜입니다. 는 시간 선택기가 준비되었습니다. 이 기사가 모든 사람에게layDate 구성 요소에 대한 사전 이해를 제공할 수 있기를 바랍니다

위 내용은 layDate 구성 요소를 통해 날짜/시간 선택기를 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.