`
iceyouxiner
  • 浏览: 3748 次
  • 性别: Icon_minigender_2
  • 来自: 北京
最近访客 更多访客>>
社区版块
存档分类
最新评论

日历代码

    博客分类:
  • java
J# 
阅读更多
<style type="text/css">
.TrTitle{
background:#D4D0C8;
height:20;
border-bottom:5px solid #D4D0C8;
color:#000; cursor: hand;
}
.TrOver{
background:#808080;
height:18;
border:0px solid #999999;
color:#D4D0C8; cursor: hand;
}
.TdOver{
background:#ffffff;
height:18;width:22px;
border:0px solid #cccccc;

color:#000;cursor: hand;
}
.TdOut{
background:#C6D3EF;
height:16;width:20px;
border:1px solid #3169C6;
color:#333333; cursor: hand;
}

.TdOver2{
background:#e6e6e6;
height:18;
border:1px solid #cccccc;
border-top:1px solid #ffffff;
border-left:1px solid #ffffff;
color:#666666;cursor: hand;
}
.TdOut2{
background:#e6e6e6;
height:18;
border:1px solid #ffffff;
border-top:1px solid #cccccc;
border-left:1px solid #cccccc;
color:#000000; cursor: hand;
}
</style>
<script language="javascript">
document.writeln("<div id='DateGird' style='display:none;position: absolute;border:1px solid #404040;background-color:  #D4D0C8;'></div>");
var Glob_YY=parseInt(new Date().getFullYear());
var Glob_MM=parseInt(new Date().getMonth()+1);
var Glob_DD=parseInt(new Date().getDate());

function shotable(InputName)
{        
        var DateArray=["日","一","二","三","四","五","六"];
        var output=""
        output=output+"<div style='padding:5px;border-top:1px solid #f4f4f4;border-left:1px solid #f4f4f4;'><table style='width:156px;font-size:9pt;cursor:default;border:0px solid #999999;' border='0' cellpadding='0' cellspacing='0'>";
        output=output+"<tr ><td colspan='7' class='TrTitle'><span ID='yearUU'>"+Glob_YY+"</span><span ID='monthUU'>"+Glob_MM+"</span></td></tr><table>";
        output=output+"<table style='font-size:12px;font-family: \"宋体\", Helvetica, sans-serif;cursor:default;border:0px solid #999999;border-top:1px solid #404040;border-left:1px solid #404040;border-right:1px solid #efefef;border-bottom:1px solid #efefef;' border='1' cellpadding='0' cellspacing='0'>";
        output=output+"<tr align='center'>";
        for(var i=0;i<7;i++)        output=output+"<td class='TrOver'>"+DateArray[i]+"</td>";
        output=output+"</tr>";
        for(var i=0;i<6;i++){
        output=output+"<tr align='center'>";
                for(var j=0;j<7;j++)        output=output+"<td id='TD' name='TD' class='TdOver' onmouseover='datelist.OverBK(this,\""+InputName.name+"\")' msg=''>&nbsp;</td>";
                        output=output+"</tr>";
                }
        output=output+"</tabe></div>";

  var selectMMInnerHTML = "<select ID=\"sMonth\" onchange=\"setPan(document.getElementById('sYear').value,this.value)\" style='width:50px;'>";
  for (var i = 1; i <  13; i++)
  {
    if (i == Glob_MM)
       {selectMMInnerHTML += "<option Author=wayx value='" + i + "' selected>" + i + "月" + "</option>\r\n";}
    else {selectMMInnerHTML += "<option Author=wayx value='" + i + "'>" + i + "月" + "</option>\r\n";}
  }
  selectMMInnerHTML += "</select>";
  var selectYYInnerHTML = "<select ID=\"sYear\"  onchange=\"setPan(this.value,document.getElementById('sMonth').value)\" style='width:65px;'>";
  for (var i = 1999; i <=  Glob_YY; i++)
  {
    if (i == Glob_YY)
       {selectYYInnerHTML += "<option Author=wayx value='" + i + "' selected>" + i + "年" + "</option>\r\n";}
    else {selectYYInnerHTML += "<option Author=wayx value='" + i + "'>" + i + "年" + "</option>\r\n";}
  }
  selectYYInnerHTML += "</select>";
        document.getElementById("DateGird").innerHTML= output;
        document.getElementById("monthUU").innerHTML= selectMMInnerHTML;
        document.getElementById("yearUU").innerHTML= selectYYInnerHTML;
        //document.writeln(output);
}
function classGetDate(sName)
{
this.obj=sName || "uncDate";
//alert(Date.parse(this.obj.value));
this.YY=Glob_YY;
this.MM=Glob_MM;
this.DD=Glob_DD;
document.getElementById("DateGird").style.display="";
setPan(this.YY,this.MM);
}      

function GetDay(y,m){
        this.TDate=function(){
                this.DayArray=[];
                for(var i=0;i<42;i++)this.DayArray[i]="&nbsp;";
                for(var i=0;i<new Date(y,m,0).getDate();i++)this.DayArray[i+new Date(y,m-1,1).getDay()]=i+1;
                return this.DayArray;
                }
        return this;
        }

function setPan(YY,MM)
{
var DArray=GetDay(YY,MM).TDate();
var TDArr=document.getElementsByName("TD");
if (MM<10){var showMM="0"+MM;}else{var showMM=MM;}
for(var i=0;i<TDArr.length;i++){
        if (Glob_DD==DArray[i]&&YY==new Date().getFullYear()&&MM==new Date().getMonth()+1){TDArr[i].className="TdOut";}else{TDArr[i].className="TdOver"}
        TDArr[i].innerHTML=DArray[i];
        if (DArray[i]<10){var showDD="0"+DArray[i];}else{var showDD=DArray[i];}
        TDArr[i].msg=YY+"-"+showMM+"-"+showDD;
        }
}

datelist={
        dfd:function (sName)
        {
        var dateGirdObj=document.getElementById("DateGird");
        //var i= sName.style.top

        dateGirdObj.style.top=cmGetY(sName)+20;
        dateGirdObj.style.left=cmGetX(sName);
        shotable(sName);
        classGetDate(sName);
        },
        OverBK:function(t,m){
              
                if(t.className!="TdOut"){
                      
                        t.onmouseout=function(){t.className="TdOver";}
                }
                if(t.innerHTML!="&nbsp;")t.className="TdOut";
                t.onclick=function(){
                        if (t.innerHTML!="&nbsp;"){//alert(t.innerHTML);
                                document.getElementById(m).value=t.msg;
                                t.className="TdOver";
                                document.getElementById("DateGird").style.display="none";
                        }
                }
              
        }
}


function cmGetX (obj){var x = 0;do{x += obj.offsetLeft;obj = obj.offsetParent;}while(obj);return x;}
function cmGetY (obj){var y = 0;do{y += obj.offsetTop;obj = obj.offsetParent;}while(obj);return y;}

</script>
分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    日历代码 显示日历的代码

    日历代码 显示日历的代码 日历代码 显示日历的代码

    WEB手机端万年历日历代码

    【标题】"WEB手机端万年历日历代码"涉及的核心技术主要是在移动设备上的Web应用开发,特别是针对HTML5的特性,实现一个跨平台、功能完善的万年历日历组件。HTML5作为现代Web开发的标准,提供了许多新功能和API,使得...

    小日历代码(可以嵌套到网页中)

    小日历代码是一种常见的网页元素,它允许用户在网页中查看日期并进行简单的日程管理。这个压缩包中包含了一个小日历的实现,由图片和一个HTML页面组成,为开发者提供了一种嵌入到网站中的实用工具。下面将详细解释这...

    HTML5手机端万年历日历代码.zip

    HTML5手机端万年历日历代码是一种基于HTML5技术实现的交互式日历组件,适用于移动设备。这个代码库包含了一个完整的解决方案,允许用户在手机上查看和管理日期,具有良好的可定制性和适应性。下面我们将深入探讨...

    简洁的jQuery日历代码.zip

    本资源"简洁的jQuery日历代码"提供了一种实现日历功能的方法,这对于网页开发中的日期选择或者日程管理是非常实用的。下面将详细介绍这个jQuery日历代码的核心知识点。 首先,jQuery日历的基本结构基于HTML、CSS和...

    几款漂亮的js 日历代码集合

    本文将深入探讨几款优秀的js日历代码,它们不仅功能强大,而且界面美观,能为你的网页增添专业且友好的用户体验。 1. **jQuery UI Datepicker** jQuery UI库中的Datepicker是一款经典且高度可定制的日历插件。它...

    javaweb日历代码(简洁可用)

    本资源提供了一个名为WebCalendar的简洁可用的日历代码,适用于快速集成到你的项目中。下面将详细介绍这个日历组件及其使用方法。 一、日历组件介绍 WebCalendar是一个基于HTML、CSS和JavaScript构建的轻量级日历...

    Jquery 日历代码 可选年月

    而“Jquery 日历代码 可选年月”指的是使用jQuery构建的一个日历插件,它允许用户选择特定的年份和月份。这种功能在网页应用中非常常见,例如用于日程安排、日期输入或时间跟踪等场景。 首先,这个日历插件的核心是...

    这个事ajax日历代码,希望对大家有帮助

    本篇将深入探讨一个基于Ajax的日历代码实现,旨在帮助开发者更好地理解和运用此类功能。 首先,日历组件是Web应用中常见的一种交互元素,常用于日期选择或事件安排等场景。Ajax日历通过异步请求获取日历数据,可以...

    c语言日历代码

    日历代码

    一个不错的日历代码 javascript编写

    用JavaScript编写的一款比较经典的日历代码

    功能超全,节日超多的日历代码。(兼容FF)

    功能超全,节日超多的日历代码。(兼容FF)

    JS 实现活动日历代码

    接下来,我们需要编写JS代码来动态生成日历,并处理鼠标悬停事件。这里我们使用`calendar.js` 文件来实现这个功能。 1. 获取当前月份和年份,并创建日历表格。 ```javascript // 获取当前日期 var today = new ...

    Html日历代码

    HTML日历代码是一种用于网页设计的技术,它允许开发者在网页上创建交互式的日期选择器或者展示日期信息。HTML本身并不具备构建动态日历组件的能力,但通过与其他技术如JavaScript、CSS以及可能的库或框架(如jQuery...

    实用日历代码

    【实用日历代码】这个主题涉及的是编程领域中创建日历应用的相关知识。在软件开发中,日历功能是常见的需求,特别是在移动设备和桌面应用中。开发者常常需要编写代码来展示日期、事件安排和时间管理功能。这篇博客...

    精美日历代码,原代码

    【精美日历代码详解】 日历是我们日常生活中不可或缺的一个工具,无论是用于规划工作还是记录重要日期,它都扮演着重要角色。在IT行业中,创建一个功能完善的精美日历不仅可以提升用户体验,也是展示编程技巧的好...

    用excel vba写的日历代码

    用excel vba写的日历部分代码如下 Private Sub Calendar(ByVal iyear, ByVal imonth) For icol = 1 To 7 For irow = 3 To 8 Cells(irow, icol) = "" Next Next iday = DateSerial(iyear, imonth, 1) '取得...

    android日历代码

    以下是对这个“android日历代码”项目的详细解释: 1. **Android SDK和环境搭建**:首先,你需要安装Android Studio,它是Google官方提供的集成开发环境(IDE),用于编写Android应用程序。项目中可能包含`build....

    JS日历代码

    最后,从提供的压缩包文件"JS日历代码"中,你可以找到具体的实现代码,通过阅读和学习,加深对上述概念的理解,并可以根据需求进行修改和定制。记得在实践中不断探索和改进,以提高你的JavaScript编程技能。

    一个用JS封装好的日历代码

    本资源提供了一个用JS封装好的日历代码,这是一个非常实用的功能,通常用于网站上的日期选择器或者事件管理应用。下面我们将详细探讨这个日历代码的实现原理、关键功能以及可能的扩展点。 首先,让我们了解日历组件...

Global site tag (gtag.js) - Google Analytics