Javascript做的日历

最新推荐文章于 2024-05-17 14:54:19 发布

原创最新推荐文章于 2024-05-17 14:54:19 发布 · 584 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #日历 #table #list #border #date

<%@LANGUAGE="JAVASCRIPT" CODEPAGE="932"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>Untitled Document</title>

</head>

var i;

var j;

var dat;

var ye;

var m;

var d;

ye = 2005;

m = 1;

//设置date的初始值

dat = new Date(ye, m, 1);

//当年份改变时，获取被选中的年份

function List1_onSelected(x)

{

var list = document.F1.DropDownList1;

ye = list.options[x].value;

}

//当月改变时，获取被选中的月

function List2_onSelected(x)

{

var list = document.F1.DropDownList2;

m = list.options[x].value;

// window.confirm(parseInt(ye));

// window.alert( parseInt(m));

}

//按下按钮显示日历

function B1_onClick()

{

var myTable;

myTable = document.getElementById("Table1");

//清空table

var allRows = myTable.getElementsByTagName("tr");

while(allRows.length > 1)

{

myTable.deleteRow(1);

}

d = 0;

dat = new Date( parseInt(ye), parseInt(m) - 1, 1);

//确定每月的天数

switch(m.toString())

{

case "2" :

if (ye % 4 == 0 && ye % 100 != 0 || ye % 400 == 0)

{

d = 29;

}

else

{

d = 28;

}

break;

case "1" :

case "3" :

case "5" :

case "7" :

case "8" :

case "10" :

case "12" :

d = 31;

break;

case "4" :

case "6" :

case "9" :

case "11" :

d = 30;

break;

}

var i = 0;

var dd = new Date(parseInt(ye), parseInt(m) - 1, 1);

var wee = dd.getDay();

var newRow = myTable.insertRow();

var newCell;

var k = 1;

//如果第一天不是星期天，要空出来几个位子

if(k == 1 && parseInt(wee) != 0)

{

for(var h = 0; h < wee; h ++ )

{

newCell = newRow.insertCell();

newCell.innerText = " ";

}

//然后逐个插入天数

for(k = 1; k <= d; k ++ )

{

var date = new Date(parseInt(ye), parseInt(m) - 1, k);

var w = date.getDay();

newCell = newRow.insertCell();

newCell.innerText = k.toString();

if(w == 6 && k != d)

{

newRow = myTable.insertRow();

}

</script>

<body>

<div>

</select>

</select><input type="button" value="B1" name="B1" onclick="B1_onClick()">

<tr>

</tr>

</table>

</div>

</form>

</body>

</html>