A

간단한 날짜입력용 자바스크립트 달력입니다.

· 17년 전 · 2990
var Calendar = Class.create();

Calendar.prototype = {

    initialize : function(e, obj) {

        this.event = (e) ? e : window.event;
        this.obj = obj;

        this.today = this.today = new Date();
        this.year = this.today.getFullYear();
        this.month = this.today.getMonth();
        this.date = 1;


        this.dayIndex = new Array('일','월','화','수','목','금','토');
        this.lastDate = new Array(31,  28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);

        this.calWin = window.open('', 'calendar', 'width=200,height=180,top='+(this.event.clientY+100)+',left='+this.event.clientX);
        this.makeCal();
    },

    makeCal : function(type, addSub) {
        this.newDate = new Date(this.year, this.month, this.date);
        if(type && addSub) {
            if(type == 'year') {
                if(addSub == 'add') this.newDate.setFullYear(this.newDate.getFullYear()+1); else this.newDate.setFullYear(this.newDate.getFullYear()-1);
            } else if(type == 'month') {
                if(addSub == 'add') this.newDate.setMonth(this.newDate.getMonth()+1); else this.newDate.setMonth(this.newDate.getMonth()-1);
            }
        }

        this.year = this.newDate.getFullYear();
        this.month = this.newDate.getMonth();
        this.day = this.newDate.getDay();

        if(((this.year%4 == 0) && (this.year%100 != 0)) || (this.year%400 ==0)) {
            this.lastDate[1] = 29;
        } else {
            this.lastDate[1] = 28;
        }

        _cal = this;

        this.calsrc = "<table border='0' cellpadding='0' cellspacing='1' borderColor='#eeeeee' width='100%'>\n";
        this.calsrc += "<tr>\n";
        this.calsrc += "<td><span onClick=opener._cal.makeCal('year','sub')><<</span> <span onClick=opener._cal.makeCal('month','sub')><</span></td>\n";
        this.calsrc += "<td>"+this.newDate.getFullYear()+"년 "+(this.month+1)+"월</td>\n";
        this.calsrc += "<td><span onClick=opener._cal.makeCal('month','add')>></span> <span onClick=opener._cal.makeCal('year','add')>>></span></td>\n";
        this.calsrc += "</tr>\n";
        this.calsrc += "</table>\n";
        this.calsrc += "<table border='0' cellpadding='0' cellspacing='1' borderColor='#eeeeee' width='100%'>\n";
        this.calsrc += "<tr>\n";
        for(i=0; i<this.dayIndex.length; i++) {
            this.calsrc += "<td>"+this.dayIndex[i]+"</td>\n";
        }
        this.calsrc += "</tr>\n";
        for(i=0; i<this.day+this.lastDate[this.newDate.getMonth()];i++) {
            if(!(i%7)) {
                this.calsrc += "</tr>\n";
                this.calsrc += "<tr>\n";
            }

            if(i >= this.day) {
                this.calsrc += "<td><span onClick=opener._cal.setDate('"+((i-this.day)+1)+"')>"+((i-this.day)+1)+"</td>\n";
            } else {
                this.calsrc += "<td></td>\n";
            }
        }
        this.calsrc += "</tr>\n";
        this.calsrc += "</table>\n";

        this.calWin.document.open();
        this.calWin.document.clear();
        this.calWin.document.write(this.calsrc);
        this.calWin.document.close();
    },

    fillZero : function(len, value) {
        var value = value.toString();
        var addLen = len - value.length;
        for(i=0; i<addLen; i++) {
            value = "0"+value;
        }
        return value;
    },

    setDate : function(day) {
        $(this.obj).value = this.year+'-'+this.fillZero(2,this.month+1)+'-'+this.fillZero(2,day);
        this.calWin.close();
    }
}



<input type="text" name="date" id="date'><input type="button" onClick="new Calendar(event, 'date')" value="달력" />

이렇게 사용하면 됩니다.
급조하느라 부족한부분이 많습니다.
[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]
|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
17년 전 조회 1,831
17년 전 조회 1,687
17년 전 조회 2,758
17년 전 조회 1,718
17년 전 조회 1,311
17년 전 조회 1,460
17년 전 조회 3,342
17년 전 조회 2,386
17년 전 조회 2,181
17년 전 조회 1,431
17년 전 조회 2,652
17년 전 조회 1,389
17년 전 조회 1,343
17년 전 조회 1,592
17년 전 조회 2,958
17년 전 조회 2,621
17년 전 조회 2,680
17년 전 조회 1,403
17년 전 조회 1,522
17년 전 조회 3,476
17년 전 조회 3,050
17년 전 조회 4,310
17년 전 조회 2,488
17년 전 조회 2,578
17년 전 조회 1,632
17년 전 조회 2,738
17년 전 조회 2,427
17년 전 조회 3,192
17년 전 조회 2,694
17년 전 조회 1,846
17년 전 조회 2,629
17년 전 조회 1,783
17년 전 조회 1,371
17년 전 조회 2,443
17년 전 조회 3,075
17년 전 조회 4,277
17년 전 조회 3,355
17년 전 조회 1,608
17년 전 조회 1,846
17년 전 조회 2,440
17년 전 조회 1,749
17년 전 조회 1,925
17년 전 조회 2,901
17년 전 조회 2,340
17년 전 조회 1,979
17년 전 조회 4,380
17년 전 조회 3,234
17년 전 조회 1,625
17년 전 조회 3,759
17년 전 조회 2,990
17년 전 조회 2,263
17년 전 조회 1,486
17년 전 조회 2,519
17년 전 조회 2,258
17년 전 조회 2,169
17년 전 조회 2,112
17년 전 조회 1,365
17년 전 조회 2,072
17년 전 조회 3,098
17년 전 조회 1,618
17년 전 조회 1,863
17년 전 조회 1,533
17년 전 조회 1,787
17년 전 조회 1,751
17년 전 조회 1,656
17년 전 조회 2,740
17년 전 조회 2,518
17년 전 조회 2,305
17년 전 조회 1,594
17년 전 조회 2,611
17년 전 조회 4,442
17년 전 조회 2,937
17년 전 조회 1,839
17년 전 조회 2,029
17년 전 조회 3,437
17년 전 조회 2,420
17년 전 조회 4,004
17년 전 조회 1,855
17년 전 조회 2,463
17년 전 조회 2,299
17년 전 조회 1,798
17년 전 조회 2,318
17년 전 조회 2,118
17년 전 조회 2,146
17년 전 조회 3,278
17년 전 조회 2,340
17년 전 조회 1,623
17년 전 조회 1,650
17년 전 조회 2,297
17년 전 조회 3,392
17년 전 조회 2,320
17년 전 조회 1,726
17년 전 조회 4,414
17년 전 조회 2,218
17년 전 조회 3,656
17년 전 조회 6,216
17년 전 조회 1,673
17년 전 조회 1,820
17년 전 조회 1,415
17년 전 조회 1,507