1. <script typet="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
  2. <head>
  3.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4.     <title></title>
  5. </head>
  6. <body>
  7.     <form id="form1">
  8.         <div>
  9.             <select name=YYYY id="YYYY" onchange="YYYYMM(this.value)">
  10.                 <option value="">选择 年</option>
  11.             </select>
  12.             <select name=MM id="MM" onchange="MMDD(this.value)">
  13.                 <option value="">选择 月</option>
  14.             </select>
  15.             <select name=DD id="DD">
  16.                 <option value="">选择 日</option>
  17.             </select>
  18.         </div>
  19.         <input id="hfValue" />
  20.         <button id="btnSave" text="保存" onclick="btnSave_Click()"></button>
  21.     </form>
  22. </body>
  23. </html>
  24. <script language="JavaScript">
  25.     function getValue() {
  26.         var year = document.getElementById("YYYY").options[document.getElementById("YYYY").selectedIndex].value;
  27.         var month = document.getElementById("MM").options[document.getElementById("MM").selectedIndex].value;
  28.         var day = document.getElementById("DD").options[document.getElementById("DD").selectedIndex].value;
  29.         document.getElementById("hfValue").value = year + "-" + month + "-" + day;
  30.     }
  31.  
  32.     window.onload = function () {
  33.         strYYYY = $('#YYYY').prop('outerHTML');// document.form1.YYYY.outerHTML;
  34.         strMM = $('#MM').prop('outerHTML');//document.form1.MM.outerHTML;
  35.         strDD = $('#DD').prop('outerHTML');//document.form1.DD.outerHTML;
  36.         MonHead = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
  37.         //先给年下拉框赋内容
  38.         var y = new Date().getFullYear();
  39.         var str = strYYYY.substring(0, strYYYY.length - 9);
  40.  
  41.         for (var i = (y - 80) ; i < (y + 2) ; i++) //以今年为准，前30年，后30年
  42.         {
  43.             str += "<option value='" + i + "'> " + i + " 年" + "</option>\r\n";
  44.         }
  45.         $('#YYYY').prop('outerHTML', str + "</select>") //document.form1.YYYY.outerHTML = str + "</select>";
  46.         //赋月份的下拉框
  47.         var str = strMM.substring(0, strMM.length - 9);
  48.         for (var i = 1; i < 13; i++) {
  49.             str += "<option value='" + i + "'> " + i + " 月" + "</option>\r\n";
  50.         }
  51.         $('#MM').prop('outerHTML', str + '</select>') // document.form1.MM.outerHTML = str + "";
  52.         $('#MM').val(y);
  53.         $('#MM').val(new Date().getMonth() + 1); //document.form1.MM.value = new Date().getMonth() + 1;
  54.         var n = MonHead[new Date().getMonth()];
  55.         if (new Date().getMonth() == 1 && IsPinYear(YYYYvalue)) n++;
  56.         writeDay(n); //赋日期下拉框
  57.         $('#DD').val(new Date().getDate());// document.form1.DD.value = new Date().getDate();
  58.     }
  59.     function YYYYMM(str) //年发生变化时日期发生变化(主要是判断闰平年)
  60.     {
  61.         var MMvalue = $("#MM").val();//document.form1.MM.options[document.form1.MM.selectedIndex].value;
  62.         if (MMvalue == "") {
  63.             DD.outerHTML = strDD;
  64.             return;
  65.         }
  66.         var n = MonHead[MMvalue - 1];
  67.         if (MMvalue == 2 && IsPinYear(str)) n++;
  68.         writeDay(n)
  69.     }
  70.     function MMDD(str) //月发生变化时日期联动
  71.     {
  72.         var YYYYvalue = $("#YYYY").val();// document.form1.YYYY.options[document.form1.YYYY.selectedIndex].value;
  73.         if (str == "") {
  74.             DD.outerHTML = strDD;
  75.             return;
  76.         }
  77.         var n = MonHead[str - 1];
  78.         if (str == 2 && IsPinYear(YYYYvalue)) n++;
  79.         writeDay(n)
  80.     }
  81.     function writeDay(n) //据条件写日期的下拉框
  82.     {
  83.         var s = strDD.substring(0, strDD.length - 9);
  84.         for (var i = 1; i < (n + 1) ; i++) s += "<option value='" + i + "'> " + i + " 日" +
  85.  
  86.     "</option>\r\n";
  87.         $('#DD').prop('outerHTML', s + "</select>");  //document.form1.DD.outerHTML = s + "</select>";
  88.  
  89.     }
  90.     function IsPinYear(year) //判断是否闰平年
  91.     {
  92.         return (0 == year % 4 && (year % 100 != 0 || year % 400 == 0))
  93.     }
  94.  
  95. </script>

年月日 生日 js插件的更多相关文章

  1. js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable

    js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable 一.总结 一句话总结:bootstrap能够做为最火的框架,绝对不仅仅只有我看到的位置,它应该还有很多位置可 ...

  2. 【jQuery小实例】js 插件 查看图片

    ---本系列文章所用使用js均可在本博客文件中找到. 像淘宝一样,鼠标放在某一件商品上,展示大图信息,甚至查看图片的具体部位.给人超炫的效果,这种效果实现基于js文件和js插件.大致可以分为三步,添加 ...

  3. 【PC端】jQuery+PHP实现浏览更多内容(jquery.more.js插件)

    参数说明: 'amount' : '10', //每次显示记录数 'address' : 'comments.php', //请求后台的地址 'format' : 'json', //数据传输格式 ' ...

  4. chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法[bubuko.com]

    chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法,原文:http://bubuko.com/infodetail-328671.html 默认情况下如下图 Y轴并不是从0开始 ...

  5. jQuery.cookie.js插件了解及使用方法

    jquery.cookie.js插件实现浏览器的cookie存储,该插件是基于jquery开发,方便cookie使用. jquerycookie.js的下载地址 http://plugins.jque ...

  6. Intense Images – 全屏浏览图像的 JS 插件

    Intense Images 是一个独立的 JavaScript 库,用于查看全屏图像.使用触摸/鼠标来实现图片位置的平移.图像元素的所有样式都是可以自定义的,Intense.js 只处理图像浏览器和 ...

  7. 购物车增加、减少商品时动画效果：jQuery.Fly.js插件使用方法

    某些电商网站加入购物车和减少购物车商品数量时,有个小动画,以抛物线形式增减,如图:      这里用到了第三方jQuery.Fly.js插件(底层依赖Jquery库,地址:https://github ...

  8. 代码规范和常用的js插件以及测试工具

    1.代码规范 .model层 1.1.1database file_proerty 1.1.2java fileProperty. 1.2.字段要有空指针 1.3.不创建爱数据库外键约束 1.4.已知 ...

  9. jquery.autocomplete.js 插件的自定义搜索规则

    这二天开始用jquery.autocomplete这个自动完成插件.功能基本比较强大,但自己在实际需求中发现还是有一处不足!问题是这样:当我定义了一个本地数据JS文件时,格式为JSON式的数组.如下: ...

随机推荐

  1. ToolStrip控件在窗体没有焦点的情况下,需要单击二次才能够激发事件的解决办法

    protected override void WndProc(ref Message m) { if (m.Msg == 0x210) { Control control = Control.Fro ...

  2. SRM 146 DIV1 800

    Problem Statement      The purpose of a roundabout is to control the flow of traffic at a busy inter ...

  3. seaJS循环依赖的解决原理

    seajs模块的六个状态. var STATUS = {  'FETCHING': 1, // The module file is fetching now. 模块正在下载中  'FETCHED': ...

  4. cookie小记

    清除cookie可用下面2种的方法.注意如果要清除的cookie的域是指定的,则这里也应该指定,否则无效                1:                Response.Cooki ...

  5. 可以让电脑卡机的c++程序

    #include <iostream> #include<windows.h> #include <shellapi.h> #include <stdio.h ...

  6. 64位win7下powerdesigner15连接postgresql9.2问题解决

    win7下已经安装jdk1.6 64bit版 安装powerdesigner 15,下载了postgressql jdbc驱动(下载地址:http://jdbc.postgresql.org/down ...

  7. JSP开发模式2（计算器）

    CalculatorBean———————————————————————————————————————————— public class CalculatorBean {    private ...

  8. Java 占位符使用 和 修饰符

    Java中占位符的使用 String类的format()方法 String类的format()方法用于创建格式化的字符串以及连接多个字符串对象.熟悉C语言的同学应该记得C语言的sprintf()方法, ...

  9. 学习笔记-----Android的View绘制过程

    边看源码边参考别人的博客等,做一下学习笔记. 要了解View的绘制,首先得知道View树的结构:(可以参考http://blog.csdn.net/qinjuning/article/details/ ...

  10. LoadRunner参数更新方法和数据分配

    参数化的定义:使用指定的数据源中的值来替换脚本录制生成的语句中的参数. 对Vuser脚本进行参数化的好处: 1.减小脚本的大小 2.提供了使用不同的脚本的值执行脚本的能力 参数化涉及两个任务: 1.用 ...