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 $(function(){ $('#startDate').keydown( function(){ autoHyphen(event,this) }); }); function autoHyphen(event, obj) { var key = event.charCode || event.keyCode || 0; $text = $(obj); if (key !== 8 && key !== 9) { if ($text.val().length === 4) { $text.val($text.val() + '-'); } if ($text.val().length === 7) { $text.val($text.val(..

JQuery는 HTML의 클라이언트 사이드 조작을 단순화 하도록 설계된 크로스 플랫폼의 자바스크립트 라이브러리입니다. 제이쿼리를 사용하는 이유는 아래와 같습니다. 페이지 내부 요소에 접근하기 쉽다. 제이쿼리를 사용하지 않으면 DOM 트리를 이용해서 요소(element)에 접근해야 합니다. 이는 배우기도 어렵고 불편한데, 제이쿼리를 사용하면 CSS의 선택자를 이용해서 간편하게 접근할 수 있습니다. 페이지의 보여지는 모습을 변경하기 쉽다. 동적으로 페이지의 모습(CSS)를 변경하기 위해서는 자바스크립트를 사용해야 합니다. 이를 제이쿼리를 이용하여 작성하면 코드도 간결해지고 직관적으로 작성할 수 있습니다.또, 아작스(AJAX)등에서 페이지를 리로딩하지 않고 동적으로 로딩할 때도 자바스크립트를 이용하는데, 이것..

소스 코드 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 $(document).ready(function(){ $("#startDate").datepicker({dateFormat: 'yy-mm-dd'}); $("#endDate").datepicker({dateFormat: 'yy-mm-dd'}); $("#endDate").on("change",function(){ //마감일자가 시작일자보다 더 빠르면 경고 후 text 공백으로 if($("#startDate").val() > $("#endDate").val()){ alert("마감일자가 시작일자보다 더 빠를 수 없습니다."); $("#endDate")..

간단한 소스라 설명은 생략하겠습니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 입력창 자동으로 탭 넘기기 function AutoTab(me, next, iLen) { if ($(me).val().length == iLen) { $("#"+next).focus(); } } 테스트 해보세요!!

우선 메서드 들에대해서 간단하게 설명 해보겠습니다. 1. 부모자식관계로 추가할 경우 (append, prepend) $(A).append(B) : 부모 A태그 가장 뒤에 B태그를 위치시킴 $(A).prepend(B) : 부모 A태그 가장 앞에 B태그를 위치시킴 $(A).appendTo(B) : A태그를 부모 B태그 가장 뒤에 위치시킴. $(A).prependTo(B) : A태그를 부모 B태그 가장 앞에 위치시킴. appendTo 와 prependTo 의 경우 A, B 의 위치에 혼동이 생길 수 있으니 주의하여 사용하시길 바랍니다. 2. 형제관계로 추가할 경우 (after, before) $(A).before(B) : A객체 앞에 B를 위치시킴 $(A).after(B) : A객체 뒤에 B를 위치시킴 $(A..