asp.net千奇百怪的日历
作者:清清月儿
主页:http://blog.csdn.net/21aspnet/ 时间:2007.5.14
日历控件是我们经常使用的,本文把常用的几款日历总结如下。
1.下拉日历梅花雨版第1款
点评:最经典的几乎完美了。
代码:
<%...@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<html >
<head runat="server">
<title>日历控件</title>
<script type="text/javascript" src="calendar.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input id="Text1" type="text" onFocus=calendar() />
</div>
</form>
</body>
</html>
<!--
document.write("<div id=meizzCalendarLayer style='position: absolute; z-index: 9999; width: 144; height: 193; display: none'>");
document.write("<iframe name=meizzCalendarIframe scrolling=no frameborder=0 width=100% height=100%></iframe></div>");
function writeIframe()
...{
var strIframe = "<html><head><meta http-equiv='Content-Type' content='text/html; charset=gb2312'><style>"+
"*{font-size: 12px; font-family: 宋体}"+
".bg{ color: "+ WebCalendar.lightColor +"; cursor: default; background-color: "+ WebCalendar.darkColor +";}"+
"table#tableMain{ width: 142; height: 180;}"+
"table#tableWeek td{ color: "+ WebCalendar.lightColor +";}"+
"table#tableDay td{ font-weight: bold;}"+
"td#meizzYearHead, td#meizzYearMonth{color: "+ parent.WebCalendar.wordColor +"}"+
".out { text-align: center; border-top: 1px solid "+ WebCalendar.DarkBorder +"; border-left: 1px solid "+ WebCalendar.DarkBorder +";"+
"border-right: 1px solid "+ WebCalendar.lightColor +"; border-bottom: 1px solid "+ WebCalendar.lightColor +";}"+
".over{ text-align: center; border-top: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF;"+
"border-bottom: 1px solid "+ WebCalendar.DarkBorder +"; border-right: 1px solid "+ WebCalendar.DarkBorder +"}"+
"input{ border: 1px solid "+ WebCalendar.darkColor +"; padding-top: 1px; height: 18; cursor: hand;"+
" color:"+ WebCalendar.wordColor +"; background-color: "+ WebCalendar.btnBgColor +"}"+
"</style></head><body onselectstart='return false' style='margin: 0px' oncontextmenu='return false'><form name=meizz>";
if (WebCalendar.drag)...{ strIframe += "<scr"+"ipt language=javascript>"+
"var drag=false, cx=0, cy=0, o = parent.WebCalendar.calendar; function document.onmousemove(){"+
"if(parent.WebCalendar.drag && drag){if(o.style.left=='')o.style.left=0; if(o.style.top=='')o.style.top=0;"+
"o.style.left = parseInt(o.style.left) + window.event.clientX-cx;"+
"o.style.top = parseInt(o.style.top) + window.event.clientY-cy;}}"+
"function document.onkeydown(){ switch(window.event.keyCode){ case 27 : parent.hiddenCalendar(); break;"+
"case 37 : parent.prevM(); break; case 38 : parent.prevY(); break; case 39 : parent.nextM(); break; case 40 : parent.nextY(); break;"+
"case 84 : document.forms[0].today.click(); break;} window.event.keyCode = 0; window.event.returnValue= false;}"+
"function dragStart(){cx=window.event.clientX; cy=window.event.clientY; drag=true;}</scr"+"ipt>"}
strIframe += "<select name=tmpYearSelect onblur='parent.hiddenSelect(this)' style='z-index:1;position:absolute;top:3;left:18;display:none'"+
" onchange='parent.WebCalendar.thisYear =this.value; parent.hiddenSelect(this); parent.writeCalendar();'></select>"+
"<select name=tmpMonthSelect onblur='parent.hiddenSelect(this)' style='z-index:1; position:absolute;top:3;left:74;display:none'"+
" onchange='parent.WebCalendar.thisMonth=this.value; parent.hiddenSelect(this); parent.writeCalendar();'></select>"+
"<table id=tableMain class=bg border=0 cellspacing=2 cellpadding=0>"+
"<tr><td width=140 height=19 bgcolor='"+ WebCalendar.lightColor +"'>"+
" <table width=140 id=tableHead border=0 cellspacing=1 cellpadding=0><tr align=center>"+
" <td width=15 height=19 class=bg title='向前翻 1 月 快捷键:←' style='cursor: hand' onclick='parent.prevM()'><b><</b></td>"+
" <td width=60 id=meizzYearHead title='点击此处选择年份' onclick='parent.funYearSelect(parseInt(this.innerText, 10))'"+
" onmouseover='this.bgColor=parent.WebCalendar.darkColor; this.style.color=parent.WebCalendar.lightColor'"+
" onmouseout='this.bgColor=parent.WebCalendar.lightColor; this.style.color=parent.WebCalendar.wordColor'></td>"+
" <td width=50 id=meizzYearMonth title='点击此处选择月份' onclick='parent.funMonthSelect(parseInt(this.innerText, 10))'"+
" onmouseover='this.bgColor=parent.WebCalendar.darkColor; this.style.color=parent.WebCalendar.lightColor'"+
" onmouseout='this.bgColor=parent.WebCalendar.lightColor; this.style.color=parent.WebCalendar.wordColor'></td>"+
" <td width=15 class=bg title='向后翻 1 月 快捷键:→' onclick='parent.nextM()' style='cursor: hand'><b>></b></td></tr></table>"+
"</td></tr><tr><td height=20><table id=tableWeek border=1 width=140 cellpadding=0 cellspacing=0 ";
if(WebCalendar.drag)...{strIframe += "onmousedown='dragStart()' onmouseup='drag=false' onmouseout='drag=false'";}
strIframe += " borderColorLight='"+ WebCalendar.darkColor +"' borderColorDark='"+ WebCalendar.lightColor +"'>"+
" <tr align=center><td height=20>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td></tr></table>"+
"</td></tr><tr><td valign=top width=140 bgcolor='"+ WebCalendar.lightColor +"'>"+
" <table id=tableDay height=120 width=140 border=0 cellspacing=1 cellpadding=0>";
for(var x=0; x<5; x++)...{ strIframe += "<tr>";
for(var y=0; y<7; y++) strIframe += "<td class=out id='meizzDay"+ (x*7+y) +"'></td>"; strIframe += "</tr>";}
strIframe += "<tr>";
for(var x=35; x<39; x++) strIframe += "<td class=out id='meizzDay"+ x +"'></td>";
strIframe +="<td colspan=3 class=out title='"+ WebCalendar.regInfo +"'><input style=' background-color: "+
WebCalendar.btnBgColor +";cursor: hand; padding-top: 4px; width: 100%; height: 100%; border: 0' onfocus='this.blur()'"+
" type=button value=' 关闭' onclick='parent.hiddenCalendar()'></td></tr></table>"+
"</td></tr><tr><td height=20 width=140 bgcolor='"+ WebCalendar.lightColor +"'>"+
" <table border=0 cellpadding=1 cellspacing=0 width=140>"+
" <tr><td><input name=prevYear title='向前翻 1 年 快捷键:↑' onclick='parent.prevY()' type=button value='<<'"+
" onfocus='this.blur()' style='meizz:expression(this.disabled=parent.WebCalendar.thisYear==1000)'><input"+
" onfocus='this.blur()' name=prevMonth title='向前翻 1 月 快捷键:←' onclick='parent.prevM()' type=button value='< '>"+
" </td><td align=center><input name=today type=button value='Today' onfocus='this.blur()' style='width: 50' title='当前日期 快捷键:T'"+
" onclick="parent.returnDate(new Date().getDate() +'/'+ (new Date().getMonth() +1) +'/'+ new Date().getFullYear())">"+
" </td><td align=right><input title='向后翻 1 月 快捷键:→' name=nextMonth onclick='parent.nextM()' type=button value=' >'"+
" onfocus='this.blur()'><input name=nextYear title='向后翻 1 年 快捷键:↓' onclick='parent.nextY()' type=button value='>>'"+
" onfocus='this.blur()' style='meizz:expression(this.disabled=parent.WebCalendar.thisYear==9999)'></td></tr></table>"+
"</td></tr><table></form></body></html>";
with(WebCalendar.iframe)
...{
document.writeln(strIframe); document.close();
for(var i=0; i<39; i++)
...{
WebCalendar.dayObj[i] = eval("meizzDay"+ i);
WebCalendar.dayObj[i].onmouseover = dayMouseOver;
WebCalendar.dayObj[i].onmouseout = dayMouseOut;
WebCalendar.dayObj[i].onclick = returnDate;
}
}
}
function WebCalendar() //初始化日历的设置
...{
this.regInfo = "关闭的快捷键:[Esc]";
this.daysMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
this.day = new Array(39); //定义日历展示用的数组
this.dayObj = new Array(39); //定义日期展示控件数组
this.dateStyle = null; //保存格式化后日期数组
this.objExport = null; //日历回传的显示控件
this.eventSrc = null; //日历显示的触发控件
this.inputDate = null; //转化外的输入的日期(d/m/yyyy)
this.thisYear &
分享到:
相关推荐
在ASP.NET中,日历控件(Calendar Control)是一个非常常用的UI组件,它允许用户以图形化的方式选择日期。在本教程中,我们将探讨如何在ASP.NET应用中调用日历控件,并将所选日期赋值给一个文本框。 首先,让我们...
在这个"asp.net 个性日历"项目中,我们关注的是如何利用ASP.NET技术来创建一个具备日历记事本功能且界面个性化的Web应用组件。 在ASP.NET中,我们可以使用多种方式来实现日历功能,包括但不限于使用内置的Web控件、...
在ASP.NET中,自定义日历控件是一个常见的需求,特别是在构建交互式Web应用程序时,用户经常需要输入日期。为了提供便捷的用户体验,开发者通常会将日历功能集成到TextBox中,使得用户可以通过点击文本框触发一个...
ASP.NET日历控件是.NET框架中用于网页交互的一个重要组件,它允许用户方便地进行日期选择,常用于在线表单、事件安排等场景。在本文中,我们将深入探讨这个控件的功能、配置以及如何利用C#源码实现示例。 首先,ASP...
在本项目"ASP.NET制作记事日历"中,开发者使用了C#编程语言来实现一个功能丰富的在线日历,帮助用户以电子书的形式存储和管理日常事务。 首先,我们要理解ASP.NET的工作原理。它通过编译式的模型处理HTTP请求,这...
在ASP.NET中,日历控件是用于展示日期选择的一种常用组件,它的外观和功能可以通过主题进行定制。本文将深入探讨如何在ASP.NET中实现日历主题的变换,以达到改变用户界面风格的效果。 首先,我们需要理解什么是主题...
ASP.NET日历控件是微软开发的Web应用程序框架ASP.NET中的一个重要组成部分,它允许开发者在网页上创建交互式的日期选择功能。这个控件是基于服务器的,因此可以在服务器端进行处理,并能通过HTTP协议将结果传送到...
Asp.NET日历控件(Calendar)是ASP.NET Web Forms框架中的一个常用组件,用于在网页上展示日期选择器,用户可以通过它方便地选择日期。这个控件在Web应用程序中非常常见,尤其在处理日期输入或者事件调度时。在本文...
ASP.NET日历组件是.NET框架中用于在网页上展示日期选择功能的重要控件。它提供了一个用户友好的界面,让用户可以方便地查看和选择日期,常用于事件安排、预约系统或者任何形式的时间相关输入。在ASP.NET中,日历控件...
ASP.NET日历控件是微软开发的Web应用程序框架ASP.NET中的一个重要组件,它允许开发者在网页上添加交互式日期选择功能。这个控件为用户提供了一个直观的、易于使用的界面,用户可以通过点击或导航来选择日期,非常...
ASP.NET Web 日历控件是开发Web应用程序时常用的一种组件,尤其在构建具有日期选择功能的界面时。本文将深入探讨“asp.net web日历控件源码”,介绍其工作原理、使用方法以及如何通过源码进行自定义扩展。 首先,...
ASP.NET中的日历控件是Web开发中常用的一个组件,它允许用户以直观的日历形式选择日期,大大提升了用户体验。这个控件是.NET框架的一部分,适用于构建动态网站和Web应用程序。在ASP.NET中,我们可以利用Visual ...
今天我们将深入探讨ASP.NET日历控件以及与之相关的DLL加载。 日历控件在ASP.NET中的应用广泛,它提供了直观的日期选择方式,可以轻松集成到网页中,为用户提供了友好的界面。控件通常包含一个月份和日期的选择区域...
在ASP.NET中,日历控件(Calendar)是一种常用的用户界面元素,用于显示日期并允许用户选择特定日期。个性化日历控件则是开发者为了提供更丰富、更具特色的用户体验而进行的自定义设计。本示例将详细介绍如何在ASP...
在ASP.NET中,日历控件(Calendar)是一个常用的用户界面元素,它允许用户通过图形化界面选择日期,常用于日期输入场景,如预订系统、日程安排等。本篇文章将深入探讨ASP.NET日历选择的相关知识点。 1. **日历控件...
在ASP.NET 中,日历控件(Calendar Control)是一个非常实用的组件,它允许用户通过直观的日历界面来选择日期,常见于需要日期输入的场景,如事件安排、预约系统等。本篇文章将深入探讨六个ASP.NET 日历控件的使用...
在ASP.NET中,日历控件(Calendar Control)是一个非常重要的UI组件,它允许用户以交互的方式选择日期,常用于事件计划、约会管理等场景。本压缩包包含了一系列关于ASP.NET日历控件的资源,总计约10个,帮助开发者在...
《基于ASP.NET + SQLSERVER的教学日历管理系统及课程设计报告》 在信息技术高速发展的今天,教学管理系统的构建已经成为教育领域的重要课题。本项目是大二学生独立完成的一个实践案例,虽然作者自评其报告写作不够...