카페 > 홈페이지 쇼핑몰 제작 및 관.. | 김바다
http://cafe.naver.com/wwwtip/3
날짜를 입력받는 페이지를 만들때 언제부터 언제까지 기간을 입력 받아야 할때가 가끔 있습니다. 이때에 사용하면 좋은 소스 입니다.
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<style type="text/css">
input,select {font-size:12; border:1; border-style:solid; border-color:#669999; cursor:hand;}
body,tr,p {font-size:12;}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
function MakeArray(n) { this.length = n; return this; }
function getFirstDay(theYear){
var firstDate = new Date(theYear,this.offset,1)
return firstDate.getDay()
}
function aMonth(name,length,offset) {
this.name = name
this.length = length
this.offset = offset
this.getFirstDay = getFirstDay
}
function getFebLength(theYear) {
theYear = (theYear < 1900) ? theYear + 1900: theYear
if ((theYear % 4 == 0 && theYear % 100 != 0) || theYear % 400 == 0) {
return 29
}
return 28
}
theMonths = new MakeArray(12)
theMonths[1] = new aMonth("January",31,0)
theMonths[2] = new aMonth("February",28,1)
theMonths[3] = new aMonth("March",31,2)
theMonths[4] = new aMonth("April",30,3)
theMonths[5] = new aMonth("May",31,4)
theMonths[6] = new aMonth("June",30,5)
theMonths[7] = new aMonth("July",31,6)
theMonths[8] = new aMonth("August",31,7)
theMonths[9] = new aMonth("September",30,8)
theMonths[10] = new aMonth("October",31,9)
theMonths[11] = new aMonth("November",30,10)
theMonths[12] = new aMonth("December",31,11)
//오늘
var today= new Date()
var toy = today.getYear()
var tom = today.getMonth()
var tod = today.getDate()
var toh = today.getHours()
var ton = today.getMinutes()
//기본틀 뿌려주기
function writedate(form,name)
{
var content = ""
content += "<TABLE bgcolor='#d5d5d5' cellpadding=0 cellspacing=0 style='border-style:solid;border-width:1;'>"
content += "<TR><td COLSPAN=7 align=right bgcolor='#EEE8D2'>"
content += "<a href='#' onclick='now_set(\""+form+"\",\""+name+"\")'>now</a> "
content += "<input type=text size=4 name='"+ name +"Year' readonly><input type=text size = 2 name='"+ name +"Month' readonly>"
content += "<input type=button value='◀' style='font-size:11;' onclick='stepmove(\""+form+"\",\""+name+"\",-1)'><input type=button value='▶' style='font-size:11;' onclick='stepmove(\""+form+"\",\""+name+"\",1)'>"
content += "</td></TR>"
content += "<TR bgcolor=#F4EFC6 style='font-family:돋움;font-size:12;'><td style='color:red'>일</td><td>월</td><td>화</td><td>수</td><td>목</td><td>금</td><td style='color:blue'>토</td></TR>"
content += "<TR>"
for (i=1,d=1; i<=6; i++) {
content += "<tr>"
content += "<td><INPUT TYPE='text' NAME='"+name+"Day' SIZE=2 style='border:0;color:red' readonly onclick='clickday(\""+form+"\",\""+name+"\","+d+")'></TD>"
d++
for (k=2; k<7; k++,d++) {
content += "<TD><INPUT TYPE='text' NAME='"+name+"Day' SIZE=2 style='border:0;' readonly onclick='clickday(\""+form+"\",\""+name+"\","+d+")'></TD>"
}
content += "<td><INPUT TYPE='text' NAME='"+name+"Day' SIZE=2 style='border:0;color:blue' readonly onclick='clickday(\""+form+"\",\""+name+"\","+d+")'></TD>"
content += "</tr>"
d++
}
content += "</TABLE>"
//
content += "<TABLE><tr><td>"
content += " <input type=text size=2 name='"+name+"Dayno' readonly>일"
content += " <select name='"+name+"Hour'>"
for (var i=0;i<24;i++) { content += "<option value="+i+">"+i+"</option>" }
content += "</select>시 "
content += "<select name='"+name+"Minute'>"
for (var i=0;i<60;i++) { content += "<option value="+i+">"+i+"</option>" }
content += "</select>분"
content += "</td></tr></TABLE>"
document.write(content)
return
}
//맞는 월로 수정하기
function viewdate(form,name,y,m) {
var tar = "document."+form+"."+name
//월 첫날 기준
if (y<=0 || m<0) { y=toy
m=tom
}
var thisdate = new Date(y,m,1)
var samemonth = false
if (toy==y && tom==m) samemonth = true
var dayoffset = thisdate.getDay()
if (m==1) { theMonths[2].length = getFebLength(y) }
var howlong = theMonths[m+1].length
eval(tar+"Year").value = y
eval(tar+"Month").value = m+1
for (var i=0; i<42; i++) {
eval(tar+"Day["+i+"]").style.background="white"
if (i<dayoffset || i>=(howlong + dayoffset)) { eval(tar+"Day["+i+"]").value = "" }
else { eval(tar+"Day["+i+"]").value = i - dayoffset + 1 }
}
if (toy==y && tom==m) { eval(tar+"Day["+eval(dayoffset+tod)+"]").style.background="yellow" }
}
function now_set(form,name) {
viewdate(form,name,toy,tom)
eval(form+"."+name+"Dayno").value = tod
eval(form+"."+name+"Hour").options[toh].selected = true
eval(form+"."+name+"Minute").options[ton].selected = true
return
}
//
function clickday(form,name,num) {
var tar = "document."+form+"."+name
var y = eval(tar+"Year").value
var m = eval(eval(tar+"Month").value) - 1
var thisdate = new Date(y,m,1)
var day = eval(tar+"Day["+eval(num-1)+"]").value
if (day.length>0) {
for (var i=0; i<42; i++) { eval(tar+"Day["+i+"]").style.background="white" }
if (toy==y && tom==m) { eval(tar+"Day["+ eval(num-day+tod)+"]").style.background="yellow" }
eval(tar+"Day["+eval(num-1)+"]").style.background="#cc99cc"
eval(tar+"Dayno").value = day
}
return
}
//달 이동 하기
function stepmove(form,name,step) {
var tar = "document."+form+"."+name
var y = eval(tar+"Year").value
var m = eval(eval(tar+"Month").value) + eval(step) - 1
if (m>=12) { y=eval(y)+1; m=0; }
if (m<0) { y=eval(y)-1; m=11; }
viewdate(form,name,y,m)
return
}
// end -->
</SCRIPT></head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red" onload="">
<FORM name = 'calen'>
<table><tr><td>
<script language="JavaScript">
writedate("calen","fromtime")
viewdate("calen","fromtime",2002,10)
</script>
</td><td>
<script language="JavaScript">
writedate("calen","totime")
viewdate("calen","totime",2002,11)
</script>
</td></tr>
</table>
</form>
</body>
</html>
$ 이 소스는 noerr님이 taeyo.pe.kr 에 올려주신 소스 입니다.