在网上找到一个js的日期选着控件
calendar.htc
<public:component tagname="calendar">
<public:attach event="onfocus" onevent="show()" />
<public:attach event="onblur" onevent="hide()" />
<public:property name="format" />
<public:property name="status" />
<public:method name="showCurrentDate" />
<public:method name="hide" />
<public:method name="showMore" />
<script>
if (format==null)
format = "yyyy-mm-dd";

function calculateSumOffset(item, offsetName)
{
var totalOffset = 0;

do
{
totalOffset += eval('item.'+offsetName);
item = eval('item.offsetParent');
} while (item != null);
return totalOffset;
}

function hideElement(elmID)
{
var leftX, rightX, topY, bottomY, objLeft, objTop;

for (i = 0; i < document.all.tags(elmID).length; i++)
{
obj = document.all.tags(elmID)[i];
if (! obj || ! obj.offsetParent)
continue;
// Find the element's offsetTop and offsetLeft relative to the BODY tag.
leftX = calculateSumOffset(tblMonthView, 'offsetLeft');
rightX = leftX + tblMonthView.offsetWidth;
topY = calculateSumOffset(tblMonthView, 'offsetTop');
bottomY = topY + tblMonthView.offsetHeight;
objLeft = calculateSumOffset(obj, 'offsetLeft');
objTop = calculateSumOffset(obj, 'offsetTop');
if (leftX > (objLeft + obj.offsetWidth) || objLeft > rightX) ;
else if (objTop > bottomY) ;
else obj.style.visibility = "hidden";
}
}

function showElement(elmID)
{

for (i = 0; i < document.all.tags(elmID).length; i++)
{
obj = document.all.tags(elmID)[i];
if (! obj || ! obj.offsetParent)
continue;
obj.style.visibility = "";
}
}

var arrWeekName = new Array("日","一","二","三","四","五","六");
var today = new Date();
var currentYear, currentMonth, inputYear, inputMonth, inputDate;
currentYear = inputYear = today.getYear();
currentMonth = inputMonth = today.getMonth();
inputDate = today.getDate();

status = false;
var tblMonthView, trWeek, tdToday;
var tblShowDay;
var spanCurrentMonth, spanCurrentYear;
var divMore;

var strHTML = '<table id="MonthView' + uniqueID + '" cellpadding=0 cellspacing=0 lang=ch onselectstart="return false" onmouseover="' + uniqueID + '.status=true;" onmouseout="' + uniqueID + '.status=false;" style="position:absolute; display:none; background:#FFFFFF; border:1 solid black;width:220;cursor:hand;">'
+ '<tr>'
+ ' <td>'
+ ' <table width="100%" border=0 cellpadding=1 cellspacing=1 id="ShowDay' + uniqueID + '" style="font-size:9pt;">'
+ ' <tr align="center">'
+ ' <td style="font-family:webdings;font-size:9pt;background:#A4B9D7;" onmouseover="this.style.color=/'white/'" onmouseout="this.style.color=/'black/'" onclick="' + uniqueID + '.showCurrentDate(/'py/')">33</td>'
+ ' <td style="font-family:webdings;font-size:9pt;background:#A4B9D7;" onmouseover="this.style.color=/'white/'" onmouseout="this.style.color=/'black/'" onclick="' + uniqueID + '.showCurrentDate(/'pm/')">3</td>'
+ ' <td colspan="3" style="color:black;font-family:宋体;font-weight:bold;" nowarp>'
+ ' <span id="CurrentYear' + uniqueID + '" style="text-decoration:underline;" onmouseover="this.style.color=/'white/'" onmouseout="this.style.color=/'black/'" onclick="' + uniqueID + '.showMore(1990,2020,this.innerHTML)"></span> 年'
+ ' <span id="CurrentMonth' + uniqueID + '" style="text-decoration:underline;" onmouseover="this.style.color=/'white/'" onmouseout="this.style.color=/'black/'" onclick="' + uniqueID + '.showMore(1,12,this.innerHTML)"></span> 月</td>'
+ ' <td style="font-family:webdings;font-size:9pt;background:#A4B9D7;" onmouseover="this.style.color=/'white/'" onmouseout="this.style.color=/'black/'" onclick="' + uniqueID + '.showCurrentDate(/'nm/')">4</td>'
+ ' <td style="font-family:webdings;font-size:9pt;background:#A4B9D7;" onmouseover="this.style.color=/'white/'" onmouseout="this.style.color=/'black/'" onclick="' + uniqueID + '.showCurrentDate(/'ny/')">44</td>'
+ ' </tr>'
+ ' <tr id="Week' + uniqueID + '" style="font-size:9pt; color:black; text-align:center;"><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>'
+ ' <tr><td colspan=7 style="background-color:black; height:1pt;"></td></tr>'
+ ' </table>'
+ ' </td>'
+ '</tr>'
+ '<tr><td style="background-color:black; height:1pt;"></td></tr>'
+ '<tr>'
+ ' <td>'
+ ' <table width="100%" border=0 cellpadding=1 cellspacing=1>'
+ ' <tr style="font-size:9pt; color:black;">'
+ ' <td id="Today' + uniqueID + '"></td>'
+ ' <td id="Button' + uniqueID + '" style="text-align:right;" onclick="' + uniqueID + '.status=false;' + uniqueID + '.hide();">[关闭]</td>'
+ ' </tr>'
+ ' </table>'
+ ' </td>'
+ ' </tr>'
+ '</table>'
+ '<div id="More' + uniqueID + '" style="display:none; cursor:hand; font:9px verdana; width:80px; position:absolute; border:1px solid #425E87; overflow-y:scroll; overflow-x:hidden; background-color:#fff; FILTER:progid:DXImageTransform.Microsoft.Shadow(Color=#999999,offX=10,offY=10,direction=120,Strength=5); SCROLLBAR-FACE-COLOR: #E5E9F2; SCROLLBAR-HIGHLIGHT-COLOR:#E5E9F2; SCROLLBAR-SHADOW-COLOR:#A4B9D7; SCROLLBAR-3DLIGHT-COLOR: #A4B9D7; SCROLLBAR-ARROW-COLOR:#000000; SCROLLBAR-TRACK-COLOR:#eeeee6; SCROLLBAR-DARKSHADOW-COLOR: #ffffff;"></div>';
element.insertAdjacentHTML("afterEnd",strHTML);
tblMonthView = eval("MonthView" + uniqueID);
trWeek = eval("Week" + uniqueID);
tdToday = eval("Today" + uniqueID);
tblShowDay = eval("ShowDay" + uniqueID);
spanCurrentMonth = eval("CurrentMonth" + uniqueID);
spanCurrentYear = eval("CurrentYear" + uniqueID);
divMore = eval("More" + uniqueID);
for (var i=0; i<arrWeekName.length; i++)
trWeek.cells[i].innerHTML = arrWeekName[i];
tdToday.attachEvent("onclick", setTodayValue);

function formatDate(y, m, d, strFormat)
{
var dm = (m>=10?m:"0" + m), dd = (d>=10?d:"0" + d);
return strFormat.replace(/yyyy/ig, y).replace(/mm/ig, dm).replace(/dd/ig, dd).replace(/m/ig, m).replace(/d/ig, d);
}

function setCaption()
{
spanCurrentYear.innerHTML = currentYear;
spanCurrentMonth.innerHTML = formatDate(0, currentMonth + 1, 0, "mm");
}

function bulidDay()
{
var arrMonthDay = new Array(31,28,31,30,31,30,31,31,30,31,30,31);
if ((currentYear % 400 == 0) || ((currentYear % 100!=0) && (currentYear % 4==0)))
arrMonthDay[1] = 29;
while (tblShowDay.rows.length>3)
tblShowDay.deleteRow(3);
firstDay = new Date(currentYear,currentMonth,1);
weekDay = firstDay.getDay();

prevMonthEnd = arrMonthDay[(currentMonth>0?currentMonth - 1:11)];
prevMonthStart = prevMonthEnd - weekDay;
thisMonthStart = 0;
thisMonthEnd = arrMonthDay[currentMonth];
nextMonthStart = 0;
var d = new Date();
var nowDate = d.getDate();
var nowMonth = d.getMonth();
var nowYear = d.getYear();
var i, j;

for (i=0; i<6; i++)
{
tempRow = tblShowDay.insertRow();

for (j=0; j<7; j++)
{
tempCell = tempRow.insertCell();
tempCell.style.cssText = "border:1pt solid white; font-size:9pt; color:#808080; text-align:center;";
//填充当月1号以前的日期
if (prevMonthStart<prevMonthEnd)
tempCell.innerHTML = ++prevMonthStart;
//填充本月日期

else if (thisMonthStart<thisMonthEnd)
{
tempCell.style.color = ((j==0 || j==6)?"red":"black");
tempCell.innerHTML = ++thisMonthStart;
tempCell.onclick = action;
tempCell.onmouseover = mouseover;
tempCell.onmouseout = mouseout;
if (nowYear==currentYear && nowMonth==currentMonth && nowDate==thisMonthStart)
tempCell.style.border = "1pt solid red";
if (inputYear==currentYear && inputMonth==currentMonth && inputDate==thisMonthStart)
tempCell.bgColor = "menu";
}
//填充下月日期
else tempCell.innerHTML = ++nextMonthStart;
}
}
}

function setTodayValue()
{

with (new Date())
{
var strDate = formatDate(getYear(), (getMonth() + 1), getDate(), "yyyy-mm-dd");
tdToday.innerHTML = "今日:" + strDate;
element.value = strDate;
}
status = false;
hide();
}

function setToday()
{

with (new Date())
{
tdToday.innerHTML = "今日:" + formatDate(getYear(), (getMonth() + 1), getDate(), "yyyy-mm-dd");
}
}

function showCurrentDate(cmd)
{

switch (cmd)
{
case "py":currentYear--; break;
case "ny":currentYear++; break;

case "pm":if (--currentMonth<0)
{
currentMonth = 11;
currentYear--;
}
break;

case "nm":if (++currentMonth>11)
{
currentMonth = 0;
currentYear++;
}
break;
}
setCaption();
bulidDay();
setToday();

//element.focus();
hideElement("SELECT");
hideElement("OBJECT");
}

function show()
{

if (!status)
{
var ParseRegx = new RegExp(format.replace(/yyyy/g, "(//d{4})").replace(/mm/g, "(//d{2})").replace(/dd/g, "(//d{2})"), "g");
var t = element.value.replace(ParseRegx, "$2-$3-$1");
var d = new Date(t);
if (isNaN(d))
d = new Date();
inputYear = currentYear = d.getYear();
inputMonth = currentMonth = d.getMonth();
inputDate = d.getDate();
element.value = formatDate(inputYear, (inputMonth + 1), inputDate, format);
setCaption();
bulidDay();
setToday();
tblMonthView.style.top = calculateSumOffset(element, "offsetTop") + element.offsetHeight;
tblMonthView.style.left = calculateSumOffset(element, "offsetLeft");
tblMonthView.style.display = "block";
element.focus();
hideElement("SELECT");
hideElement("OBJECT");
}
}

function hide()
{

if (!status)
{
showElement("SELECT");
showElement("OBJECT");
tblMonthView.style.display = "none";
}
}

function mouseover()
{
this.bgColor="#9999FF";
}

function mouseout()
{
if (inputYear==currentYear && inputMonth==currentMonth && inputDate==this.innerHTML)
this.bgColor="menu";
else
this.bgColor="#FFFFFF";
}

function action()
{
inputYear = currentYear;
inputMonth = currentMonth;
inputDate = this.innerHTML;
bulidDay();
element.value = formatDate(inputYear, (inputMonth + 1), inputDate, format);
status = false;
hide();
}
var cssNotSelect = "padding:0px 0px 2px 5px; width:100%; color:#000; letter-spacing:2px; text-decoration:none;",
cssSelected = "background-color:#00006C;color:#fff;padding:0px 0px 2px 5px; width:100%; letter-spacing:2px; text-decoration:none;";

function showMore(starNum,endNum,selectedValue)
{
var obj = window.event.srcElement;
var selectedIndex = selectedValue - starNum;

divMore.style.height = 0;
divMore.style.top = calculateSumOffset(obj, "offsetTop") + obj.offsetHeight;
divMore.style.left = calculateSumOffset(obj, "offsetLeft");
divMore.selectedIndex = selectedIndex;

divMore.onclick = function()
{
var selectedObj = window.event.srcElement;

if( "nobr" == selectedObj.tagName.toLowerCase() && divMore.contains(selectedObj))
{
var tmp = parseInt(selectedObj.innerHTML, 10);

if(parseInt(obj.innerHTML, 10) != tmp)
{

if (tmp>12)
{
obj.innerHTML = tmp;
currentYear = tmp;

} else
{
obj.innerHTML = formatDate(0, tmp, 0, "mm");
currentMonth = tmp - 1;
}
showCurrentDate("");
}
}
}

divMore.onlosecapture = alert
var strHTML = "";

for(var i=starNum;i<=endNum;i++)
{
strHTML += "<nobr onmouseover=/"this.parentNode.getElementsByTagName('nobr')[this.parentNode.selectedIndex].style.cssText='" + cssNotSelect + "';this.style.cssText='" + cssSelected + "'/" onmouseout=/"this.style.cssText='" + cssNotSelect + "'/" style=/"" + cssNotSelect + "/">"+i+"</nobr><br>"
}
divMore.innerHTML = strHTML;

showBox(150);
}

function showBox(iHeight)
{
divMore.style.height =1;
divMore.style.display = "block";
window.clearInterval(divMore.timeHandle);
divMore.timeHandle = window.setInterval(interValHandle,1);
var s = 0,t = 1;

function interValHandle()
{
divMore.scrollTop = 1000000;
s = s + t*t;
t += 0.5;
divMore.style.height = parseInt(divMore.style.height) + Math.floor(s);
//divMore.style.width = 65 / iHeight * divMore.offsetHeight;

if( divMore.offsetHeight > iHeight )
{
window.clearInterval(divMore.timeHandle);
divMore.style.height = iHeight;
divMore.scrollTop = divMore.childNodes[0].offsetHeight * divMore.selectedIndex;
divMore.getElementsByTagName("nobr")[divMore.selectedIndex].style.cssText = cssSelected;
window.document.attachEvent("onclick",

divMore.hide = function()
{
divMore.style.display = "none";
window.document.detachEvent("onclick", divMore.hide);
}
);
}
}
}
</script>
</public:component>
加工成自定义控件
InputCalendar.cs
using
System;
using
System.ComponentModel;
using
System.Drawing;
using
System.Web;
using
System.Web.UI;
using
System.Web.UI.WebControls;
[assembly: TagPrefix(
"
Jxmstc
"
,
"
Jxmstc
"
)]
namespace
Jxmstc

{
[
DefaultProperty("Text"),
ToolboxData(@"<{0}:InputCalender
ID='iptCad'
runat='server'></{0}:InputCalender>")
]

/**//// <summary>
/// 日期输入控件,
/// </summary>
public class InputCalender : CompositeControl

{
private TextBox _textBox;
[
Bindable(true), Category("Appearance"), DefaultValue(""), Description("获取或设置文本框输入文本")
]
public string Text

{
get

{
EnsureChildControls();
return _textBox.Text;
}
set

{
EnsureChildControls();
_textBox.Text = value;
}
}

[
Bindable(true), Category("Appearance"), DefaultValue(""), Description("长度")
]
public int CssWidth

{

get
{ return (ViewState["Length"] != null ? (int)ViewState["Length"] : 100); }

set
{ ViewState["Length"] = value; }
}
[
Bindable(true), Category("Appearance"), DefaultValue(""), Description("最大输入长度")
]
public int MaxLength

{

get
{ return (ViewState["MaxLength"] != null ? (int)ViewState["MaxLength"] :10); }

set
{ ViewState["MaxLength"] = value; }
}
[
Bindable(true), Category("Appearance"), DefaultValue(""), Description("是否只读")
]
public bool ReadOnly

{

get
{ return (ViewState["ReadOnly"] != null ? (bool)ViewState["ReadOnly"] : false); }

set
{ ViewState["ReadOnly"] = value; }
}
[
Bindable(true), Category("Appearance"), DefaultValue(""), Description("脚本资源文件地址")
]
public string ScriptUrl

{

get
{ return (ViewState["ScriptUrl"] != null ? (string)ViewState["ScriptUrl"] :""); }

set
{ ViewState["ScriptUrl"] = value; }
}
public InputCalender()

{
//this.ScriptUrl = GetAppRootPath() + "Images/calendar.htc";
//Jxmstc.RootPath mypath = new RootPath();

}
protected override void CreateChildControls()

{
Controls.Clear();
_textBox = new TextBox();
_textBox.ID = "iptCad";
_textBox.ReadOnly = this.ReadOnly;
_textBox.MaxLength = this.MaxLength;
_textBox.Width = this.CssWidth;
if (this.ScriptUrl =="")

{
this.ScriptUrl = GetAppRootPath() +"Images/calendar.htc";
}
_textBox.Style.Add("behavior", "url(" + ScriptUrl + ")");
this.Controls.Add(_textBox);
}

protected override void Render(HtmlTextWriter writer)

{
AddAttributesToRender(writer);
_textBox.RenderControl(writer);

}
//<summary>
//获取网站根目录
//</summary>
//<returns></returns>
protected string GetAppRootPath()

{
try

{
string s = HttpContext.Current.Request.ApplicationPath;
//string s = "";
if (s != "/")

{
s += "/";
}
return s;
}
catch

{
return "";
}
}


}
}
使用的时候,将calendar.htc放入网站根目录的Images中,同时在web.config中添加
<
globalization
requestEncoding
="GB2312"
responseEncoding
="GB2312"
/>
源码
/Files/longren629/InputCalender.rar