datepicker(), draggable()
- jQuery UI 사이트 -
jQuery UI
jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQue
jqueryui.com
jquery 의 ui 기능을 추가로 script 로 선언해야 사용할 수 있는 메소드
아래 코드에 보면 추가로 선언해놓은 것을 볼 수 있으며, jquery 보다 아래에 코드로 선언해야 오류가 발생하지 않는다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="jquery-1.12.1-ui.js"></script>
<script>
$(() => {
$("#date").datepicker();
$("#drag").draggable();
});
</script>
<style>
#drag {
width: 200px;
height: 100px;
background: red;
border-style: solid;
}
</style>
</head>
<body>
<div id="drag"><h3>Drag</h3></div>
<input type="date" /><br />
<input type="text" readonly placeholder="날짜 선택" id="date" />
</body>
</html>728x90
'FE > JavaScript' 카테고리의 다른 글
| [JavaScript] 답글 달기 기능 만들기 (0) | 2024.03.27 |
|---|---|
| [JavaScript] jquery - slideDown, slideUp 메소드 (0) | 2024.03.27 |
| [JavaScript] append, html (0) | 2024.03.27 |
| [JavaScript] animate (0) | 2024.03.27 |
| [JavaScript] 클래스 추가, css 추가 (0) | 2024.03.27 |