日期:2014-05-16  浏览次数:20331 次

具备闹钟功能js日历
日历写得太多,没有什么好说的,这个是能够保存备忘信息,具备闹钟功能的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>
<title>simple</title>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<style type="text/css">
  div{
  font-size: 12px;
  }

  #title{
  /*宽高 居中 背景*/
  width:315px;
  height:30px;
  margin:0 auto;
  padding-top:5px;
  background-color:#ababab;
  }
  #days{
  /*宽高 居中 背景*/
  width:315px;
  height:30px;
  margin:0 auto; 
  word-spacing:3px;
  padding-top:5px;
  }
  #tb{
  /*宽高 居中 背景*/
  width:315px;
  height:150px;
  margin:0 auto;
  background-color:#aabb00;  
  }
</style>
</head>

<body>
<div id="dayhidden" style="display:none">
</div>


<div id="savemessage" style="width:250px;height:150px;position:absolute;background-color:#fffffa;z-index:10;top:50px;left:370px;display:none">
  您今天要记录事情!
  <textarea cols="35" rows="6" id="savestory">
  </textarea>
  <input type="button" value="保存" id="saveButton" onclick="calendar.saveMessage();"/>
</div>

<div id="readmessage" style="width:250px;height:150px;position:absolute;background-color:#fffffa;z-index:10;top:50px;left:370px;display:none">
  您今天要记录事情!
  <textarea cols="35" rows="6" id="readstory">
  </textarea>
  <input type="button" value="取消" id="saveButton" onclick="calendar.canelMessage();"/>
</div>


<div id="title">

<!--年下拉列表  start-->
<select name="selectYear" id="selectYear" onchange="calendar.setYear(document.all.selectYear.value);">
   <option value="2000">2000年</option>
   <option value="2001">2001年</option>
   <option value="2002">2002年</option>
   <option value="2003">2003年</option>
   <option value="2004">2004年</option>
   <option value="2005">2005年</option>
   <option value="2006">2006年</option>
   <option value="2007">2007年</option>
   <option value="2008">2008年</option>
   <option value="2009">2009年</option>
   <option value="2010">2010年</option>
   <option value="2011">2011年</option>
   <option value="2012">2012年</option>
</select>
<!--年下拉列表  end-->
当前日期<span id="currentTime"></span>
<!--月下拉列表  start-->
<select name="selectMonth" id="selectMonth" onchange="calendar.setMonth(document.all.selectMonth.value)">
   <option value="1">1月</option>
   <option value="2">2月</option>
   <option value="3">3月</option>
   <option value="4">4月</option>
   <option value="5">5月</option>
   <option value="6">6月</option>
   <option value="7">7月</option>
   <option value="8">8月</option>
   <option value="9">9月</option>
   <option value="10">10月</option>
   <option value="11">11月</option>
   <option value="12">12月</option>
</select>
<!--月下拉列表  end-->
</div>
<div id="days"> 
 星期日 
星期一 
星期二 
星期三 
星期四 
星期五 
星期六 
</div>
<div id="tb">
</div>

<script type="text/javascript" src="CookieUtil.js"></script>
<script type="text/javascript"> 

//具备闹钟功能日历
//
//
//如果用户,,cookie 删除   :)
//
//
//

//类,属性,方法,创建对象,工作调;;;
//相当于创建Calendar类..
function Calendar(){
  //年
  this.inYear;
  //月
  this.inMonth;
  //这个月天数
  this.inMonthCount;
  //这个月是星期几
  this.inSpace;
  //数组
  this.days;


  //保存一双击天数
  this.dbldays;

  //当前cookiekey
  this.cookiekey;

  //cook工具;
  this.util;
}

//下面写一个方法完成符值;
Calendar.prototype.setTitleTime = function(){
  var now = new Date();
  var temp = now.toLocaleString();
  var newtime = temp.substring(0,15);
  document.getElementById("currentTime").inner