关于万年历的实现
我现在想做个万年历，然后在某一天上面显示我想要显示的东西，求大神指导 JS
[解决办法]
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
td[colspan]{
text-align:center;
height:auto;
}
table{
border-collapse:collapse;
border-style:solid;
}
th{
width:50px;
background-color:#0FF;
}
td{
border-style:solid;
height:50px;
vertical-align:top;
}
</style>
<script type="text/javascript">
function init(){
var year=document.getElementById("year");
for(var i=2000;i<=2100;i++){
var option=document.createElement("option");
option.value=i;
option.innerHTML=i+"年";
year.appendChild(option);
if(i==2013){
option.selected=true;
}
}
var month=document.getElementById("month");
for(var i=1;i<=12;i++){
var option=document.createElement("option");
option.value=i;
if(i<10){
option.innerHTML='0'+i+"月";
}else{
option.innerHTML=i+"月";
}
month.appendChild(option);
}
var table=document.getElementById("test");
for(var i=1;i<=6;i++){
var tr=document.createElement("tr");
for(var j=1;j<=7;j++){
var td=document.createElement("td");
td.setAttribute("num",j);
tr.appendChild(td);
}
table.appendChild(tr);
}
year.onchange=showDate;
month.onchange=showDate;
}
function showDate(){
var md1=[31,28,31,30,31,30,31,31,30,31,30,31];
var md2=[31,29,31,30,31,30,31,31,30,31,30,31]
var month=document.getElementById("month").value;
var year=document.getElementById("year").value;
var date=new Date(year,month-1,1);
var tbody=document.getElementById("test");
var tds=tbody.getElementsByTagName("td");
for(var i=1;i<tds.length;i++){
tds[i].innerHTML="";
tds[i].style.backgroundColor="#CCC";
}
var day=date.getDay();
var now="";
var leap=isLeap(year);
if(leap){
now=md2;
}else{
now=md1;
}
day=day%7+1;
for(var i=1;i<day;i++){
var t=(month-2)>-1?(month-2):11;
if(month<1){
var y=year-1;
}else{
y=year;
}
tds[i].innerHTML=now[t]-(day-i)+1;
var key=getKey(y,t,tds[i].innerHTML);
tds[i].innerHTML+="<br/>"+getCookie(key);
addEvent(tds[i],key);
}
for(var i=0;i<now[month-1];i++){
tds[day].innerHTML=i+1;
var key=getKey(year,month-1,tds[day].innerHTML);
tds[day].innerHTML+="<br/>"+getCookie(key);
tds[day].style.backgroundColor="white";
var t=tds[day].getAttribute("num");
if(t==1
[解决办法]
t==7){
tds[day].style.backgroundColor='red';
}
addEvent(tds[day],key);
day++;
}
for(var i=day;i<tds.length;i++){
tds[i].innerHTML=i+1-day;
var key=getKey(year,month,tds[i].innerHTML);
tds[i].innerHTML+="<br/>"+getCookie(key);
addEvent(tds[i],key);
}
}
function isLeap(year){
if(year%100!=0){
if(year%4==0){
return true;
}
}else{
if(year%400==0){
return true;
}
}
return false;
}
function setCookie(key,value){
document.cookie=key+"="+value+";max-age="+1000*60*60*24+";";
}
function getCookie(key){
var cookie=document.cookie;
var begin=cookie.indexOf(key+"=");
if(begin!=-1){
var end=cookie.indexOf(";",begin);
if(end==-1){
end=cookie.length;
}
var context=cookie.substring(begin+(key+"").length+1,end);
return context;
}
return "";
}
function getKey(year,month,day){
var d=new Date(year,month,day);
return d.getTime();
}
function addEvent(dom,key){
if(dom.addEventListener){
dom.addEventListener('dblclick',function(){var con=prompt("请输入事宜");if(con!=null){setCookie(key,con);dom.innerHTML+=con;}},false);
}else{
dom.attachEvent("ondblclick",function(){var con=prompt("请输入事宜");if(con!=null){setCookie(key,con);dom.innerHTML+=con;}});
}
}
window.onload=init;
</script>
</head>
<body>
<table>
<tbody id="test">
<tr>
<td colspan="7">
<select id="year"></select>
<select id="month"></select>
</td>
</tr>
<tr>
<th>周日</th>
<th>周一</th>
<th>周二</th>
<th>周三</th>
<th>周四</th>
<th>周五</th>
<th>周六</th>
</tr>
</tbody>
</table>
</body>
</html>
[解决办法]
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
td[colspan]{
text-align:center;
height:auto;
}
table{
border-collapse:collapse;
border-style:solid;
}
th{
width:50px;
background-color:#0FF;
}
td{
border-style:solid;
height:50px;
vertical-align:top;
}
</style>
<script type="text/javascript">
function init(){
var year=document.getElementById("year");
for(var i=2000;i<=2100;i++){
var option=document.createElement("option");
option.value=i;
option.innerHTML=i+"年";
year.appendChild(option);
if(i==2013){
option.selected=true;
}
}
var month=document.getElementById("month");
for(var i=1;i<=12;i++){
var option=document.createElement("option");
option.value=i;
if(i<10){
option.innerHTML='0'+i+"月";
}else{
option.innerHTML=i+"月";
}
month.appendChild(option);
}
var table=document.getElementById("test");
for(var i=1;i<=6;i++){
var tr=document.createElement("tr");
for(var j=1;j<=7;j++){
var td=document.createElement("td");
td.setAttribute("num",j);
td.ondblclick=clickEvent;
tr.appendChild(td);
}
table.appendChild(tr);
}
year.onchange=showDate;
month.onchange=showDate;
}
function showDate(){
var md1=[31,28,31,30,31,30,31,31,30,31,30,31];
var md2=[31,29,31,30,31,30,31,31,30,31,30,31]
var month=document.getElementById("month").value;
var year=document.getElementById("year").value;
var date=new Date(year,month-1,1);
var tbody=document.getElementById("test");
var tds=tbody.getElementsByTagName("td");
for(var i=1;i<tds.length;i++){
tds[i].innerHTML="";
tds[i].style.backgroundColor="#CCC";
}
var day=date.getDay();
var now="";
var leap=isLeap(year);
if(leap){
now=md2;
}else{
now=md1;
}
day=day%7+1;
for(var i=1;i<day;i++){
var t=(month-2)>-1?(month-2):11;
if(t==11){
var y=year-1;
}else{
y=year;
}
tds[i].innerHTML=now[t]-(day-i)+1;
var key=getKey(y,t,tds[i].innerHTML);
tds[i].innerHTML+="<br/>"+getCookie(key);
//addEvent(tds[i],key);
tds[i].setAttribute("key",key);
}
for(var i=0;i<now[month-1];i++){
tds[day].innerHTML=i+1;
var key=getKey(year,month-1,tds[day].innerHTML);
tds[day].innerHTML+="<br/>"+getCookie(key);
tds[day].style.backgroundColor="white";
var t=tds[day].getAttribute("num");
if(t==1
[解决办法]
t==7){
tds[day].style.backgroundColor='red';
}
//addEvent(tds[day],key);
tds[day].setAttribute("key",key);
day++;
}
for(var i=day;i<tds.length;i++){
tds[i].innerHTML=i+1-day;
var key=getKey(year,month,tds[i].innerHTML);
tds[i].innerHTML+="<br/>"+getCookie(key);
//addEvent(tds[i],key);
tds[i].setAttribute("key",key);
}
}
function isLeap(year){
if(year%100!=0){
if(year%4==0){
return true;
}
}else{
if(year%400==0){
return true;
}
}
return false;
}
function setCookie(key,value){
document.cookie=key+"="+value+";max-age="+1000*60*60*24+";";
}
function getCookie(key){
var cookie=document.cookie;
var begin=cookie.indexOf(key+"=");
if(begin!=-1){
var end=cookie.indexOf(";",begin);
if(end==-1){
end=cookie.length;
}
var context=cookie.substring(begin+(key+"").length+1,end);
return context;
}
return "";
}
function getKey(year,month,day){
var d=new Date(year,month,day);
return d.getTime();
}
function addEvent(dom,key){
if(dom.addEventListener){
dom.addEventListener('dblclick',function(){var con=prompt(dom.innerHTML);if(con!=null){setCookie(key,con);dom.innerHTML+=con;}},false);
}else{
dom.attachEvent("ondblclick",function(){var con=prompt(dom.innerHTML);if(con!=null){setCookie(key,con);dom.innerHTML+=con;}});
}
}
function clickEvent(){
var key=this.getAttribute("key");
var con=prompt(this.innerHTML);
if(con!=null){
setCookie(key,con);
this.innerHTML+=con;
}
}
window.onload=init;
</script>
</head>
<body>
<table>
<tbody id="test">
<tr>
<td colspan="7">
<select id="year"></select>
<select id="month"></select>
</td>
</tr>
<tr>
<th>周日</th>
<th>周一</th>
<th>周二</th>
<th>周三</th>
<th>周四</th>
<th>周五</th>
<th>周六</th>
</tr>
</tbody>
</table>
</body>
</html>
上个有错误
