日期选择器ApexSoft Date Selector 1.0 发布 免费代码,立即可用并付有说明
conis 2003-11-03 01:07:10 星期六忙了一天搞了一个日期选择器,立即可以使用,无需更改代码
初学javascript,见笑了
演示地址:http://www.upapex.com/date.htm
js下载地址:http://www.upapex.com/soft/date.js
转载或者使用请保留版权
以下是代码,我都作了注释,有一点js代码常识应该能看懂
为了不让用户一个月一个月的加,我设了可以加年,可以选择月与月,你可以自已再设置增加年开始与终止数
//=====================================================================
//
//本程序由凌空踏烟设计制作,转载请保留版权
//联系E-mail:conis@163.net 个人主页:http://www.conis.cn ;QQ:47015280
//免费域名&免费留言簿:http://www.52113.com ;http://www.UpApex.com ;ICICC:http://www.ICICC.com
//
//======================================================================
//=========================================================================================
//使用说明
//调用方法:在要输入的日期的文本框用onclick=showdate(参数1,参数2,参数3),其中参数1为文本框的名字(注意:文本框取名不要与程序的函数名相同,最好不要与变量名相同);参数2代表当月份与天数不足2位的时候以0补位,取值范围为0与1,0代表补0,1代表不补0;参数3代表日期的格式,取值范围为0-3,0的格式:yyyy-mm-dd,1的格式为yyyy/mm/dd,2的格式为yyy年mm月dd日,3为yyyymmdd格式,默认为yyyymmdd的格式。
//例子:如果选择的日期是2003年9月1号,当你用showdate(文本框的名称,0,0)时,显示的就是2003-09-01;当用showdate(文本框的名称,1,2)时,显示的就是2003年9月1日;
//===================================================================
//日期的层
document.writeln('<Div style="width:180;height:100;position:absolute;display:none;left:0;top:0;border:1px solid #C8D6FF;z-index:100;font-size:12px" id=aboutlayer>')
document.writeln ('<Table style="width:100%;background-color:#FFFFFF" cellspacing=0 cellpadding=0 ><tr>')
document.writeln ('<td align="center" style="CURSOR:hand;background-color:#8EABFF;color:#FFFFFF" onClick="about(0)"><b>关闭</b></br></td></tr><tr><td style="font-size:12px;line-height:18px">')
document.writeln("<Font Color=#8EABFF><b>ApexSoft Date Selector</b></Font>
程序系列:ApexSoft 系列
")
document.writeln("程序名称:ASDS 1.0
")
document.writeln("程序性质:免费
")
document.writeln ('程序版本:1.0
')
document.writeln("程序设计:凌空踏烟(易晓峰)
")
document.writeln('作者主页:<a href="http://www.conis.cn"; target="_black">http://www.conis.cn<;;/a>
')
document.writeln ('联系作者:<a href="mailto:conis@163.net" title="给作者发邮件">conis@163.net</a>
联系QQ:47015280</br>')
document.writeln('软件主页:<a href="http://ApexSoft.UpApex.com"; target="_black">http://ApexSoft.UpApex.com<;;/a>
')
document.writeln('版权所有©<a href="http://www.upapex.com";>UpApex.com</a> 任何人未经许可,不得更改,转载或者使用请保留版权
')
document.writeln ('</td></tr><tr><td align="center" style="CURSOR:hand;background-color:#8EABFF;color:#FFFFFF" onClick="about(0)"><b>关闭</b></br>')
document.writeln ('</td></tr></Table></Div>')
document.writeln ('<Div style="width:160;height:140;position:absolute;display:none;left:0;top:0;border:1px solid #C8D6FF;z-index:98;background-color:#FFFFFF" id=showdatelayer valign="top">')
document.writeln ('<Table width=100% height=100% style="font-size:10px" border=0 cellspacing=0 cellpadding=0><tr><td align="center">')
document.writeln ('<Table style="background-color:#8EABFF;color:#FFFFFF" width=100%><tr><td title="减小年" style="CURSOR:hand;font-size:12px" onclick="setdate(0,0)">-Y</td><td style="CURSOR:hand;font-size:12px" title="减小月" onclick="setdate(1,0)">-M</td>')
document.writeln ('<td style="font-size:12px" align="center" id=year></td><td style="font-size:12px" align="center" >年</td><td style="font-size:12px" align="center" id=month></td><td style="font-size:12px" align="center">月</td>')
document.writeln ('<td style="CURSOR:hand;font-size:12px" title="增加年" onclick="setdate(0,1)">+Y</td><td style="CURSOR:hand;font-size:12px" title="增加月" onclick="setdate(1,1)">+M</td></tr></Table>')
document.writeln ('</td></tr><tr><td align="center"><Table width=100% style="border-bottom:1px solid #C8D6FF"><tr style="font-size:12px"><td>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td></tr></Table>')
document.writeln ('</td><tr><td><Table width=100%>')
//循环出单元格
var n=0
for (i=1;i<=6;i++){
document.writeln ('<tr align="center">')
for (j=1;j<=7;j++){
document.writeln ('<td align="center" style="font-size:12px;CURSOR:hand" onClick="selectday(this.innerText)" id=day'+n+'></td>')
n++;
}
document.writeln ('</tr>')
}
//结束循环
document.writeln ('</td></tr></table>')
document.writeln ('</td><tr><td style="font-size:12px;display:none;height:25" id=selectcell valign="bottom">')
document.writeln ('<select onchange="selectdate(0,this.value)" style="border:none;">')
document.writeln ('<option value="'+new Date().getYear()+'" selected>'+new Date().getYear()+'</option>')
for (y=new Date().getYear()-10;y<=new Date().getYear()+10;y++){
//此处可以修改选择日期的开始与结束年份
document.writeln ('<option value='+y+'>'+y+'</option>')
}
document.writeln ('</select>年<select onchange="selectdate(1,this.value)">')
document.writeln ('<option value="'+new Date().getMonth()+'" selected>'+new Date().getMonth()+'</option>')
for (m=1;m<=12;m++){
//此处可以修改选择日期的开始与结束年份
document.writeln ('<option value='+m+'>'+m+'</option>')
}
document.writeln ('<select> 月 <Span style="CURSOR:hand" onclick="opencell(0)" title="关闭时间选择器">关闭</Span>')
document.writeln ('</td></tr></Table></DIv>')
//到此日期层结束
//关闭日期层的层
document.writeln ('<Div id=closedatelayer style="display:none;left:0;top:0;position:absolute;width:110;height:10;z-index:99;font-size:12px"><Span style="CURSOR:hand" onclick="opencell(1)" title="打开时间选择器">选择 </Span><Span style="CURSOR:hand" onclick="closelayer()">关闭窗口 </Span><Span onclick="about(1)" style="CURSOR:hand" title="关于本程序">关于</Span></Div>')
var Tobject//全局变量,对象
var year//年
var month//月
var thedate//日
var datestyle//日期样式
var lack
function setdate(obj,aspect){//算日期
//obj 0=年,1=ā月 aspect 0=减 1=加
month=document.all.month.innerText//月,表格里的
year=document.all.year.innerText//年
if (month=="") month=new Date().getMonth()+1;//如果时间为空,则为当前年月
if (year=="") year=new Date().getYear();
//=====================================
if (obj==0){//年
if (aspect==0){//减
year=year-1;
}else{
year=year*1+1;
}
}else if (obj==1){
if (aspect==0){
month=month-1;
}else{
month=month*1+1;
}
}
if (month==13){//大于12月
year=year*1+1;
month=1;
}
if (month==0){//小于1月
year=year-1;
month=12;
}
writedate(year,month)
}
//======================================
function selectdate(selectobject,value){
//selectobject 0为年,1为月
if (selectobject==0){
year=value
writedate(value,month)
}else if (selectobject==1){
month=value
writedate(year,value)
}
}
//====================================
function writedate(writeyear,writemonth){//写入年与日历
var day
var firstday
if (writemonth==1||writemonth==3||writemonth==5||writemonth==7||writemonth==8||writemonth==10||writemonth==12){
day=31//大月
}else if(writemonth==4||writemonth==6||writemonth==9||writemonth==11){
day=30//小月
}else if (writeyear%4==0&&(writeyear%100!==0||writeyear%500==0)){
day=29
}else{
day=28
}
firstday=new Date(writeyear,writemonth-1,1).getDay();
firstday=0-firstday
//本月第一天是星期几
var u=firstday+1;
for (f=0;f<=41;f++){
var thisday = eval("document.all.day"+f)
//====================================小于1则为空
if (u<1||u>day){
thisday.innerHTML="";
thisday.style.cursor="default";
thisday.bgColor="#FFFFFF";
}else{
thisday.innerHTML=u
thisday.bgColor="#E6ECFF";
}
//=====================================