티스토리 뷰

WEB/Java BackEnd

[WEB] jQuery #4 / DateTimePicker

Happyoon ~ 2021. 12. 1. 01:00
728x90
반응형

1. 아래 링크로 들어가 다운로드

https://www.jqueryscript.net/time-clock/Clean-jQuery-Date-Time-Picker-Plugin-datetimepicker.html#google_vignette

 

Clean jQuery Date and Time Picker Plugin - datetimepicker

datetimepicker is a jQuery plugin that popups a simple and clean date & time picker interface when an input field on focus.

www.jqueryscript.net

 

2.  압축 풀고 build 폴더 들어가기

 

3. 이클립스 프로젝트의 원하는 위치에 각각 css, js 폴더 만들고 다음의 파일들 복붙하기

 

이러면 사용할 준비 완료!!!

코드 예시

Step04_plugin.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>/jquery/Step04_plugin.jsp</title>
<!-- 플러그인에서 제공해주는 css 로딩 -->
<link rel="stylesheet" href="css/jquery.datetimepicker.min.css" />
<!-- jquery 로딩 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<!-- 플러그인 javascript 로딩 -->
<script src="js/jquery.datetimepicker.full.min.js"></script>
</head>
<body>
   <input id="inputDate" type="text" placeholder="날짜 입력..."/>
   <script>
      $("#inputDate").datetimepicker();
   </script>
</body>
</html>

 

결과

반응형

'WEB > Java BackEnd' 카테고리의 다른 글

[WEB] JSON  (0) 2021.12.01
[WEB] jQuery #3 / fotorama 이미지 슬라이드 image slide  (0) 2021.12.01
[WEB] jQuery #2 / Effect - 숨기기, 보이기, 토글, hide()  (0) 2021.12.01
[WEB] jQuery #1 / chain action, EventListener  (0) 2021.12.01
[WEB-jsp/servlet] Filter 사용하기 / 한글 인코딩, 로그인에 필터 사용헤보기  (0) 2021.11.30
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG more
«   2024/05   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함