在JSP文件中如何调用JS日历
我写好了一个日历的js 文件，命名为Calendar3.js，如何在jsp页面中调用显示，就像博客日历那样显示
10-01-23 &
JSP中引入JS文件&script type=&text/javascript& src=&&html:rewrite page='/js/Calendar3.js'/&&&&/script&struts标签调用方式&html:text property=&today& onclick=&setday(this)& /&其中setday为你JS中的方法希望我的回答对你有所帮助
请登录后再发表评论!
&%%&不能实现js对jsp代码的赋值常规解决方法：在jsp中设置一个隐藏元素，如：&input type='hidden' name='startDate' id='startDate' value=''&在你的js时间方法中，将的时间值赋给上面的隐藏元素：document.getElementById('startDate').value = 你得到的时间最后在jsp中通过request().getParameter()获取String startDate = request().getParameter(&startDate &)；记得将startdate放到form中
请登录后再发表评论!自己写了个JS日历控件与大家分享_小组_ThinkSAAS
自己写了个JS日历控件与大家分享
自己写了个JS日历控件与大家分享
一时兴起用原生态JS写了个日历控件，不依赖js框架。
特地与大家分享下，供大家使用
与大家一起学习进步。
var d = new Date();
var year = d.getFullYear();
var month = d.getMonth()+1;
var day = d.getDate();
//年月日之间的分隔符
var splitStr="-";
//日期选择
var weekDays = new Array("日","一","二","三","四","五","六");
var months = new Array("一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月");
var lastDay = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
//判断是否为闰年
function isBissextile(year){
var isBis =
if (0==year%4&&((year%100!=0)||(year%400==0))) {
return isB
//计算某月的总天数，闰年二月为29天
function getMonthCount(year,month){
var Mcount = lastDay[month-1];
if((month==2)&&isBissextile(year)){
//计算某天是星期几
function thisWeekDay (year,month,date){
var d = new Date(year,month-1,date);
return d.getDay();
//先画一个div
document.write('&div style="display:position:z-index:10"id ="div_calendar"&&/div&');
//构建日历框
function cal(thisYear,thisMonth){
var calendarDocument = '&table style="border:1"cellspacing="7"&';
calendarDocument += '&tr&&td colspan="6"style="cursor:"align="center"onClick="getThisDay()"&';
calendarDocument += year+"年"+month+"月"+day+"日";
calendarDocument += '&/td&';
calendarDocument +='&td style="cursor:"&';
calendarDocument +='&span id="span_close"onClick="hiddenCal()"&&font size="1"&[关闭]&/font&&/span&';
calendarDocument +='&/td&&/tr&';
calendarDocument += '&tr&&td&';
calendarDocument += '&span id="backMonth"style="cursor:"onClick="backMonthClick()"&←&span&';
calendarDocument += '&/td&';
calendarDocument += '&td colspan="5"align="center"&';
//构建年份下拉框[]年
calendarDocument +="&select id ='sel_year' onChange='changeYM()'&";
for(var i = 1900;i&=2099;i++){
calendarDocument +="&option value="+i+"&"+i+"&/option&";
calendarDocument +="&/select&";
calendarDocument +="年";
//构建月份下拉框
calendarDocument +="&select id ='sel_month' onChange='changeYM()'&";
for(var i = 1;i&=12;i++){
calendarDocument +="&option value="+i+"&"+i+"&/option&";
calendarDocument +="&/select&";
calendarDocument +="月";
calendarDocument += '&/td&';
calendarDocument += '&td&';
calendarDocument += '&span id="nextMonth"style="cursor:"onClick="nextMonthClick()"&→&span&';
calendarDocument += '&/td&';
calendarDocument += '&/tr&';
calendarDocument += '&tr&';
//输出星期
for(var i = 0 ;i&weekDays.i++){
//周末标红
if(weekDays[i]=='日' || weekDays[i] == '六'){
calendarDocument+='&td align="center"style="color:red"&'+weekDays[i]+'&/td&';
calendarDocument+='&td align="center"&'+weekDays[i]+'&/td&';
calendarDocument+="&/tr&";
//输出天数
calendarDocument+="&tr&";
//算出当前年月1号是星期几
var thisWeek = thisWeekDay(thisYear,thisMonth,1);
if(thisWeek !=7){
for (var sw = 0;sw&thisWsw++){
calendarDocument+='&td&&/td&';
//开始循环输出当月天数
for (var i = 1; i & getMonthCount(thisYear,thisMonth)+1; i++){
if(thisYear==year && thisMonth == month && i== day){
//今天是周末
if(thisWeekDay(thisYear,thisMonth,i)==6 || thisWeekDay(thisYear,thisMonth,i)==0){
calendarDocument+='&td onClick="setInput('+i+')"align="center"style="border:1color:cursor:"&'+i+'&/td&';
calendarDocument+='&td onClick="setInput('+i+')"align="center"style="border:1cursor:"&'+i+'&/td&';
//周末标红
if(thisWeekDay(thisYear,thisMonth,i)==6 || thisWeekDay(thisYear,thisMonth,i)==0){
calendarDocument+='&td onClick="setInput('+i+')"align="center"style="color:cursor:"&'+i+'&/td&';
calendarDocument+='&td onClick="setInput('+i+')"onmouseover="mouseOver(this);"onmouseout="mouseOut(this)"align="center"style="cursor:"&'+i+'&/td&';
//星期六换行
if(thisWeekDay(thisYear,thisMonth,i)==6){
calendarDocument+="&/tr&";
calendarDocument+="&tr&";
calendarDocument += '&/tr&';
calendarDocument += '&/table&';
//将构建好的控件字符串追加给div
document.getElementById('div_calendar').innerHTML=calendarD
//默认选择当前年
document.getElementById('sel_year').value=thisY
//默认选择当前月
document.getElementById('sel_month').value=thisM
//全局变量——保存当前选择的年月
var fullYear =
var fullMonth =
function backMonthClick(){
if(fullMonth ==1){
fullYear=fullYear-1;
fullMonth = 12;
fullMonth=fullMonth-1;
cal(fullYear,fullMonth);
function nextMonthClick(){
if(fullMonth ==12){
fullMonth = 1;
cal(fullYear,fullMonth);
//年月下拉框
function changeYM(){
fullYear = document.getElementById('sel_year').
fullMonth = document.getElementById('sel_month').
cal(fullYear,fullMonth);
function getThisDay(){
fullYear =
fullMonth =
cal(fullYear,fullMonth);
//显示控件
function showCal(){
cal(year,month);
//计算显示控件位置
var x = document.getElementById('txt_calendar').offsetL
var y = document.getElementById('txt_calendar').offsetTop +22;
document.getElementById('div_calendar').style.left=x+"px";
document.getElementById('div_calendar').style.top= y+"px";
document.getElementById('div_calendar').style.display ="";
//隐藏控件
function hiddenCal(){
document.getElementById('div_calendar').style.display ="none";
//选择日期
function setInput(selDay){
document.getElementById('txt_calendar').value=fullYear+splitStr+fullMonth+splitStr+selD
hiddenCal();
//鼠标移进时
function mouseOver(obj){
obj.style.color="blue";
//鼠标移出时
function mouseOut(obj){
obj.style.color="";
//键盘响应
document.onkeydown=function(e)
//浏览器兼容
var thisEvent=e || window.
var keyCode = thisEvent.keyCode || thisEvent.
//如果控件是隐藏状态
if(document.getElementById('div_calendar').style.display =="none"){
switch(keyCode){
case 32://空格
getThisDay();
case 27://Esc
hiddenCal();
case 37://left
backMonthClick();
case 39://right
nextMonthClick();
var scrollFunc=function(e){
//浏览器兼容
var thisEvent=e || window.
//IE,Opera,Chrome,safari
if(thisEvent.wheelDelta){
direct = thisEvent.wheelD
else if(thisEvent.detail){//Firefox
direct = thisEvent.
//如果控件是隐藏状态
if(document.getElementById('div_calendar').style.display =="none"){
//向上滑动，调用上一个月
if(direct=="120"|| direct=="3"){
backMonthClick();
//向下滑动，调用下一个月
}else if(direct=="-120"|| direct=="-3"){
nextMonthClick();
//注册监听事件
if(document.addEventListener){
document.addEventListener('DOMMouseScroll',scrollFunc,false);
//IE,Opera,Chrome,safari
document.onmousewheel = scrollF
PHP开发框架
服务器环境
ThinkSAAS商业授权：
ThinkSAAS为用户提供有偿个性定制开发服务
ThinkSAAS将为商业授权用户提供二次开发指导和技术支持
手机客户端
ThinkSAAS接收任何功能的Iphone(IOS)和Android手机的客户端定制开发服务
让ThinkSAAS更好，把建议拿来。一个项目中，很多时候我们都需要选择时间的功能，一种能够将时间格式统一化的方法对于数据存储来说额为重要，然而使用一般文本框的形式或者下拉框的形式来完成这个功能的话就会比较繁琐，那么如何来用一个简单方法来实现这个功能呢，最理想的方式当然是使用日历控件了！
使用以下方法将会让你的程序减少不少麻烦，而且很美观哦！
首先，想使用日历，当然需要一个js日历控件了，新建一个Calendar.js文件（有了这个文件，以后想使用时调用以下就可以了，超方便），加入以下代码：（如果出现乱码，请注意编码格式！）
var isFocus= //是否为焦点
//function SelectDate(obj,strFormat) //两个参数改为只传一个
function SelectDate(obj)
var date = new Date();
var by = date.getFullYear()-10; //最小值 → 10 年前
var ey = date.getFullYear()+10; //最大值 → 10 年后
cal = (cal==null) ? new Calendar(by, ey, 0) :
//初始化为中文版，1为英文版
//cal.dateFormatStyle = strF // 默认显示格式为:yyyy-MM-dd ,还可显示 yyyy/MM/dd
cal.show(obj);
/**//* 返回日期 */
String.prototype.toDate = function(style){
var y = this.substring(style.indexOf(‘y’),style.lastIndexOf(‘y’)+1);//年
var m = this.substring(style.indexOf(‘M’),style.lastIndexOf(‘M’)+1);//月
var d = this.substring(style.indexOf(‘d’),style.lastIndexOf(‘d’)+1);//日
if(isNaN(y)) y = new Date().getFullYear();
if(isNaN(m)) m = new Date().getMonth();
if(isNaN(d)) d = new Date().getDate();
eval (“dt = new Date(‘”+ y+”‘, ‘”+(m-1)+”‘,'”+ d +”‘)”);
/**//* 格式化日期 */
Date.prototype.format = function(style){
“M+” : this.getMonth() + 1, //month
“d+” : this.getDate(),
“h+” : this.getHours(),
“m+” : this.getMinutes(),
“s+” : this.getSeconds(),
“w+” : “天一二三四五六”.charAt(this.getDay()),
“q+” : Math.floor((this.getMonth() + 3) / 3), //quarter
“S” : this.getMilliseconds() //millisecond
if(/(y+)/.test(style)){
style = style.replace(RegExp.$1,
(this.getFullYear() + “”).substr(4 – RegExp.$1.length));
for(var k in o){
if(new RegExp(“(“+ k +”)”).test(style)){
style = style.replace(RegExp.$1,
RegExp.$1.length == 1 ? o[k] :
(+ + o[k]).substr((“” + o[k]).length));
beginYear 1990
0(中文)|1(英语) 可自由扩充
dateFormatStyle “yyyy-MM-dd”;
function Calendar(beginYear, endYear, lang, dateFormatStyle){
this.beginYear = 1990;
this.endYear = 2010;
this.lang = 0;
//0(中文) | 1(英文)
this.dateFormatStyle = “yyyy-MM-dd”;
if (beginYear != null && endYear != null){
this.beginYear = beginY
this.endYear = endY
if (lang != null){
this.lang = lang
if (dateFormatStyle != null){
this.dateFormatStyle = dateFormatStyle
this.dateControl =
this.panel = this.getElementById(“calendarPanel”);
this.container = this.getElementById(“ContainerPanel”);
this.form =
this.date = new Date();
this.year = this.date.getFullYear();
this.month = this.date.getMonth();
this.colors = {
“cur_word”
: “#FFFFFF”, //当日日期文字颜色
“cur_bg”
: &#F4″, //当日日期单元格背影色
“sel_bg”
: “#FFCCCC”, //已被选择的日期单元格背影色
“sun_word”
: “#FF;, //星期天文字颜色
“sat_word”
: &#FF”, //星期六文字颜色
“td_word_light” : &#″, //单元格文字颜色
“td_word_dark” : “#CCCCCC”, //单元格文字暗色
“td_bg_out”
: “#EFEFEF”, //单元格背影色
“td_bg_over”
: “#FFCC00″, //单元格背影色
“tr_word”
: “#FFFFFF”, //日历头文字颜色
“tr_bg”
: &#″, //日历头背影色
“input_border” : “#CCCCCC”, //input控件的边框颜色
“input_bg”
: “#EFEFEF”
//input控件的背影色
this.draw();
this.bindYear();
this.bindMonth();
this.changeSelect();
this.bindData();
* 日历类属性（语言包，可自由扩展）
Calendar.language ={
“year”
: [[“”], [“”]],
“months” : [[“一月”,”二月”,”三月”,”四月”,”五月”,”六月”,”七月”,”八月”,”九月”,”十月”,”十一月”,”十二月”],
[“JAN”,”FEB”,”MAR”,”APR”,”MAY”,”JUN”,”JUL”,”AUG”,”SEP”,”OCT”,”NOV”,”DEC”]
“weeks” : [[“日”,”一”,”二”,”三”,”四”,”五”,”六”],
[“SUN”,”MON”,”TUR”,”WED”,”THU”,”FRI”,”SAT”]
“clear” : [[“清空”], [“CLS”]],
“today” : [[“今天”], [“TODAY”]],
“close” : [[“关闭”], [“CLOSE”]]
Calendar.prototype.draw = function(){
calendar =
var mvAry = [];
mvAry[mvAry.length] = ‘ &div name=”calendarForm” style=”margin: 0”&';
mvAry[mvAry.length] = ‘
&table width=&#%” border=+ cellpadding=+ cellspacing=+&';
mvAry[mvAry.length] = ‘
mvAry[mvAry.length] = ‘
&th align=”left” width=”1%”&&input style=”border: 1px solid ‘ + calendar.colors[“input_border”] + ‘;background-color:’ + calendar.colors[“input_bg”] + ‘;width:16height:20” name=”prevMonth” type=”button” id=”prevMonth” value=”&” /&&/th&';
mvAry[mvAry.length] = ‘
&th align=”center” width=”98%” nowrap=”nowrap”&&select name=”calendarYear” id=”calendarYear” style=”font-size:12”&&/select&&select name=”calendarMonth” id=”calendarMonth” style=”font-size:12”&&/select&&/th&';
mvAry[mvAry.length] = ‘
&th align=”right” width=”1%”&&input style=”border: 1px solid ‘ + calendar.colors[“input_border”] + ‘;background-color:’ + calendar.colors[“input_bg”] + ‘;width:16height:20” name=”nextMonth” type=”button” id=”nextMonth” value=”&” /&&/th&';
mvAry[mvAry.length] = ‘
mvAry[mvAry.length] = ‘
&/table&';
mvAry[mvAry.length] = ‘
&table id=”calendarTable” width=&#%” style=”border:0px solid #CCCCCC;background-color:#FFFFFF” border=+ cellpadding=+ cellspacing=+&';
mvAry[mvAry.length] = ‘
for(var i = 0; i & 7; i++){
mvAry[mvAry.length] = ‘
&th style=”font-weight:background-color:’ + calendar.colors[“tr_bg”] + ‘;color:’ + calendar.colors[“tr_word”] + ‘;”&’ + Calendar.language[“weeks”][this.lang][i] + ‘&/th&';
mvAry[mvAry.length] = ‘
for(var i = 0; i & 6;i++){
mvAry[mvAry.length] = ‘
&tr align=”center”&';
for(var j = 0; j & 7; j++){
if (j == 0){
mvAry[mvAry.length] = ‘ &td style=”cursor:color:’ + calendar.colors[“sun_word”] + ‘;”&&/td&';
} else if(j == 6){
mvAry[mvAry.length] = ‘ &td style=”cursor:color:’ + calendar.colors[“sat_word”] + ‘;”&&/td&';
mvAry[mvAry.length] = ‘ &td style=”cursor:”&&/td&';
mvAry[mvAry.length] = ‘
mvAry[mvAry.length] = ‘
&tr style=”background-color:’ + calendar.colors[“input_bg”] + ‘;”&';
mvAry[mvAry.length] = ‘
&th colspan=+&&input name=”calendarClear” type=”button” id=”calendarClear” value=”‘ + Calendar.language[“clear”][this.lang] + ‘” style=”border: 1px solid ‘ + calendar.colors[“input_border”] + ‘;background-color:’ + calendar.colors[“input_bg”] + ‘;width:100%;height:20font-size:12”/&&/th&';
mvAry[mvAry.length] = ‘
&th colspan=+&&input name=”calendarToday” type=”button” id=”calendarToday” value=”‘ + Calendar.language[“today”][this.lang] + ‘” style=”border: 1px solid ‘ + calendar.colors[“input_border”] + ‘;background-color:’ + calendar.colors[“input_bg”] + ‘;width:100%;height:20font-size:12”/&&/th&';
mvAry[mvAry.length] = ‘
&th colspan=+&&input name=”calendarClose” type=”button” id=”calendarClose” value=”‘ + Calendar.language[“close”][this.lang] + ‘” style=”border: 1px solid ‘ + calendar.colors[“input_border”] + ‘;background-color:’ + calendar.colors[“input_bg”] + ‘;width:100%;height:20font-size:12”/&&/th&';
mvAry[mvAry.length] = ‘
mvAry[mvAry.length] = ‘
&/table&';
mvAry[mvAry.length] = ‘ &/div&';
this.panel.innerHTML = mvAry.join(“”);
var obj = this.getElementById(“prevMonth”);
obj.onclick = function (){calendar.goPrevMonth(calendar);}
obj.onblur = function (){calendar.onblur();}
this.prevMonth=
obj = this.getElementById(“nextMonth”);
obj.onclick = function (){calendar.goNextMonth(calendar);}
obj.onblur = function (){calendar.onblur();}
this.nextMonth=
obj = this.getElementById(“calendarClear”);
obj.onclick = function (){calendar.dateControl.value = “”;calendar.hide();}
this.calendarClear =
obj = this.getElementById(“calendarClose”);
obj.onclick = function (){calendar.hide();}
this.calendarClose =
obj = this.getElementById(“calendarYear”);
obj.onchange = function (){calendar.update(calendar);}
obj.onblur = function (){calendar.onblur();}
this.calendarYear =
obj = this.getElementById(“calendarMonth”);
onchange = function (){calendar.update(calendar);}
onblur = function (){calendar.onblur();}
}this.calendarMonth =
obj = this.getElementById(“calendarToday”);
obj.onclick = function (){
var today = new Date();
calendar.date =
calendar.year = today.getFullYear();
calendar.month = today.getMonth();
calendar.changeSelect();
calendar.bindData();
calendar.dateControl.value = today.format(calendar.dateFormatStyle);
calendar.hide();
this.calendarToday =
//年份下拉框绑定数据
Calendar.prototype.bindYear = function(){
var cy = this.calendarY
cy.length = 0;
for (var i = this.beginY i &= this.endY i++){
cy.options[cy.length] = new Option(i + Calendar.language[“year”][this.lang], i);
//月份下拉框绑定数据
Calendar.prototype.bindMonth = function(){
var cm = this.calendarM
cm.length = 0;
for (var i = 0; i & 12; i++){
cm.options[cm.length] = new Option(Calendar.language[“months”][this.lang][i], i);
//向前一月
Calendar.prototype.goPrevMonth = function(e){
if (this.year == this.beginYear && this.month == 0){}
this.month–;
if (this.month == -1){
this.year–;
this.month = 11;
this.date = new Date(this.year, this.month, 1);
this.changeSelect();
this.bindData();
//向后一月
Calendar.prototype.goNextMonth = function(e){
if (this.year == this.endYear && this.month == 11){}
this.month++;
if (this.month == 12){
this.year++;
this.month = 0;
this.date = new Date(this.year, this.month, 1);
this.changeSelect();
this.bindData();
//改变SELECT选中状态
Calendar.prototype.changeSelect = function(){
var cy = this.calendarY
var cm = this.calendarM
for (var i= 0; i & cy. i++){
if (cy.options[i].value == this.date.getFullYear()){
cy[i].selected =
for (var i= 0; i & cm. i++){
if (cm.options[i].value == this.date.getMonth()){
cm[i].selected =
//更新年、月
Calendar.prototype.update = function (e){
this.year = e.calendarYear.options[e.calendarYear.selectedIndex].
this.month = e.calendarMonth.options[e.calendarMonth.selectedIndex].
this.date = new Date(this.year, this.month, 1);
this.changeSelect();
this.bindData();
//绑定数据到月视图
Calendar.prototype.bindData = function (){
var calendar =
var dateArray = this.getMonthViewArray(this.date.getFullYear(), this.date.getMonth());
var tds = this.getElementById(“calendarTable”).getElementsByTagName(“td”);
for(var i = 0; i & tds. i++){
tds[i].style.backgroundColor = calendar.colors[“td_bg_out”];
tds[i].onclick = function () {}
tds[i].onmouseover = function () {}
tds[i].onmouseout = function () {}
if (i & dateArray.length – 1)
tds[i].innerHTML = dateArray[i];
if (dateArray[i] != “&”){
tds[i].onclick = function () {
if (calendar.dateControl != null){
calendar.dateControl.value = new Date(calendar.date.getFullYear(),
calendar.date.getMonth(),
this.innerHTML).format(calendar.dateFormatStyle);
calendar.hide();
tds[i].onmouseover = function () {
this.style.backgroundColor = calendar.colors[“td_bg_over”];
tds[i].onmouseout = function () {
this.style.backgroundColor = calendar.colors[“td_bg_out”];
if (new Date().format(calendar.dateFormatStyle) ==
new Date(calendar.date.getFullYear(),
calendar.date.getMonth(),
dateArray[i]).format(calendar.dateFormatStyle)) {
tds[i].style.backgroundColor = calendar.colors[“cur_bg”];
tds[i].onmouseover = function () {
this.style.backgroundColor = calendar.colors[“td_bg_over”];
tds[i].onmouseout = function () {
this.style.backgroundColor = calendar.colors[“cur_bg”];
//设置已被选择的日期单元格背影色
if (calendar.dateControl != null && calendar.dateControl.value == new Date(calendar.date.getFullYear(),
calendar.date.getMonth(),
dateArray[i]).format(calendar.dateFormatStyle)) {
tds[i].style.backgroundColor = calendar.colors[“sel_bg”];
tds[i].onmouseover = function () {
this.style.backgroundColor = calendar.colors[“td_bg_over”];
tds[i].onmouseout = function () {
this.style.backgroundColor = calendar.colors[“sel_bg”];
//根据年、月得到月视图数据(数组形式)
Calendar.prototype.getMonthViewArray = function (y, m) {
var mvArray = [];
var dayOfFirstDay = new Date(y, m, 1).getDay();
var daysOfMonth = new Date(y, m + 1, 0).getDate();
for (var i = 0; i & 42; i++) {
mvArray[i] = “&”;
for (var i = 0; i & daysOfM i++){
mvArray[i + dayOfFirstDay] = i + 1;
return mvA
//扩展 document.getElementById(id) 多浏览器兼容性 from meizz tree source
Calendar.prototype.getElementById = function(id){
if (typeof(id) != “string” || id == “”)
if (document.getElementById) return document.getElementById(id);
if (document.all) return document.all(id);
try {return eval(id);} catch(e){}
//扩展 object.getElementsByTagName(tagName)
Calendar.prototype.getElementsByTagName = function(object, tagName){
if (document.getElementsByTagName) return document.getElementsByTagName(tagName);
if (document.all) return document.all.tags(tagName);
//取得HTML控件绝对位置
Calendar.prototype.getAbsPoint = function (e){
var x = e.offsetL
var y = e.offsetT
while(e = e.offsetParent){
x += e.offsetL
y += e.offsetT
return {“x”: x, “y”: y};
//显示日历
Calendar.prototype.show = function (dateObj, popControl) {
if (dateObj == null){
throw new Error(“arguments[0] is necessary”)
this.dateControl = dateO
this.date = (dateObj.value.length & 0) ? new Date(dateObj.value.toDate(this.dateFormatStyle)) : new Date() ;//若为空则显示当前月份
this.year = this.date.getFullYear();
this.month = this.date.getMonth();
this.changeSelect();
this.bindData();
if (popControl == null){
popControl = dateO
var xy = this.getAbsPoint(popControl);
this.panel.style.left = xy.x -25 + “px”;
this.panel.style.top = (xy.y + dateObj.offsetHeight) + “px”;
this.panel.style.display = “”;
this.container.style.display = “”;
dateObj.onblur = function(){calendar.onblur();}
this.container.onmouseover = function(){isFocus=}
this.container.onmouseout = function(){isFocus=}
//隐藏日历
Calendar.prototype.hide = function() {
this.panel.style.display = “none”;
this.container.style.display = “none”;
//焦点转移时隐藏日历
Calendar.prototype.onblur = function() {
if(!isFocus){this.hide();}
document.write(‘&div id=”ContainerPanel” style=”display:”&&div id=”calendarPanel” style=”position:display:z-index: 9999;’);
document.write(‘background-color: #FFFFFF;border: 1px solid #CCCCCC;width:175font-size:12margin-left:25”&&/div&’);
if(document.all)
document.write(‘&iframe style=”position:z-index:2000;width:expression(this.previousSibling.offsetWidth);’);
document.write(‘height:expression(this.previousSibling.offsetHeight);’);
document.write(‘left:expression(this.previousSibling.offsetLeft);top:expression(this.previousSibling.offsetTop);’);
document.write(‘display:expression(this.previousSibling.style.display);” scrolling=”no” frameborder=”no”&&/iframe&’);
document.write(‘&/div&’);
//–&
然后，在你需要日历控件的页面中调用就可以了，例如我有一张页面aa.html，需要使用日历控件，只需要加入：
&script src=”Calendar.js” type=”text/javascript” language=”javascript”&&/script&
&input name=”txtDate” type=”text” style=”padding-left:5” size=+ id=”txtDate” onclick=”SelectDate(this)” readonly=”readonly” /&
本文出自 WEB前端开发-SEO-SEM | 朱宝祥的博客，转载时请注明出处及相应链接。本文永久链接: /archives/1136
有人回复时邮件通知我
最受欢迎的文章
- 166,900 views - 127,438 views - 102,363 views - 30,745 views - 28,833 views - 28,265 views - 21,657 views - 21,110 views - 15,673 views - 14,614 views
Ɣ回顶部