Posted on 2009-08-25 09:16
lxasp 阅读(487)
评论(1) 编辑 收藏 引用 所属分类:
AJAX
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>简单的日期插件开发思路</title>
<meta http-equiv="content-type" content="text/html;charset=gb2312">
<!--把下面代码加到<head>与</head>之间-->
<style type="text/css">
<!--
.monthcal table { border-collapse:collapse ; border:none}
.monthcal table th {border:1px solid #ccc}
.monthcal table td {border:1px solid #ccc}
-->
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">//<!--
//取得每个月有多少天
function getDaysInMonth(month,year) {
var daysInMonth=[31,28,31,30,31,30,31,31,30,31,30,31];
if ((month==1)&&(year%4==0)&&((year%100!=0)||(year%400==0))){
return 29;
}else{
return daysInMonth[month];
}
}
function caldraw1(yyyy,mm,dd){
var $me=$("#cal1");
//输入一个年、月、日，取得该月的1号是星期几
var month1stday=new Date(yyyy,mm-1,1); //取得日期
var the1stweek=month1stday.getDay(); //取得星期
var monthalldays=getDaysInMonth(mm-1,yyyy); //取得天数
var lastTdId=the1stweek+monthalldays; //取得表格最后ID
//填充th
var ww=["日","一","二","三","四","五","六"];
$("th",$me).each(function(i,n){
$(n).text(ww[i]);
});
//填充td
var k=0;
$("td",$me).each(function(i,n){
if (i>=the1stweek && i<lastTdId){
$(n).text(++k);
if(k==dd) $(n).css('font-weight','bold');
}
});
$("#debug").val( yyyy+'.'+mm+'.'+dd + '\n\n' + $me.html() );
}
$().ready(function() {
caldraw1(2009,8,25);
});
//-->
</script>
</head>
<body>
<pre>
1.输入一个年、月、日，取得该月的1号是星期几
2,画一个7x7的表格
第一行为标题，填充:日一二三四五六
其他填充 id="d0" 至到 "d41"
</pre>
<div id="cal1" class="monthcal">
<table>
<tr>
<th scope="col"></th>
<th scope="col"></th>
<th scope="col"></th>
<th scope="col"></th>
<th scope="col"></th>
<th scope="col"></th>
<th scope="col"></th>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</div>
<textarea id="debug" style="width:98%;height:500px"></textarea>
</body>
</html>