日历控件源码

前两天需要个简单的日历控件,网上搜了一下居然还有人卖,估计是提供其他维护服务吧,反正我是用不到的,自己手写了个凑合用,自己写的兼容性没测过,如果有什么问题大家给点改进意见。

先上图


源码

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>

    <script type="text/javascript">

        //星期列表
        var WEEK = ["日","一","二","三","四","五","六"];
        //平年每月天数
        var DAYS_IN_NORMAL = [31,28,31,30,31,30,31,31,30,31,30,31];
        //闰年每月天数
        var DAYS_IN_SPECIAL = [31,29,31,30,31,30,31,31,30,31,30,31];
        //选择年份每月天数
        var DAYS_IN_SELECTED;
        //存放日期的输入框
        var CONTAINER;
        //日期分隔符
        var SPLIT;
        //日历界面
        var DATE_PANEL;
        //选定的日期,默认为当天
        var DEFAULT_DATE = new Date();

        /**
         * 日期控件入口,主要控制div层显示和隐藏
         * @param inputId 日期输入框ID
         * @param split   日期分隔符
         */
        function selectDate(inputId,split)
        {
            SPLIT = split;
            CONTAINER = document.getElementById(inputId);
            DATE_PANEL = document.getElementById("div_"+inputId);

            //获取日期输入框位置(x,y)
            var x = CONTAINER.clientLeft;
            var y = CONTAINER.clientTop + CONTAINER.clientHeight;
            var strDate = CONTAINER.value.trim();

            //设定日历的日期
            if(strDate != "")
            {
                var ymd = changeStr2ArrDate(strDate);

                if(ymd.length==3)
                {
                    DEFAULT_DATE.setFullYear(parseInt(ymd[0]));
                    DEFAULT_DATE.setMonth(parseInt(ymd[1])-1);
                    DEFAULT_DATE.setDate(parseInt(ymd[2]));
                }
                else
                {
                    alert("输入日期格式不正确");
                    return "";
                }
            }

            if(DATE_PANEL.style.display=="none")
            {
                DATE_PANEL.style.border = "1px solid black";
                DATE_PANEL.style.backgroundColor = "aliceblue";
                DATE_PANEL.style.width = "175px";
                DATE_PANEL.style.height = "160px";
                DATE_PANEL.style.position = "fixed";
                DATE_PANEL.style.zIndex = "99";
                DATE_PANEL.style.marginLeft = x;
                DATE_PANEL.style.marginTop = y;
                DATE_PANEL.innerHTML 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值