jQuery时间日期三级联动(推荐)


Posted in Javascript onNovember 27, 2016

废话不多说了,直接给大家贴js代码了,具体代码如下所述:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <script src="js/jquery-1.7.2.min.js"></script>
  <title></title>
</head>
<body>
  <form id="form1" runat="server">
  <div>
    <asp:DropDownList ID="dr_year" runat="server"></asp:DropDownList>年
    <asp:DropDownList ID="dr_month" runat="server"></asp:DropDownList>月
    <asp:DropDownList ID="dr_day" runat="server"></asp:DropDownList>日
  </div>
  </form>
</body>
</html>
<script>
  var days = 0;
  years();
  months();
  Days();
  var date = new Date();
  $("#dr_year").val(date.getFullYear());
  $("#dr_month").val((date.getMonth() + 1));
  $("#dr_day").val(date.getDate());
  $("#dr_year").change(function () {
    months();
    Days();
  });
  $("#dr_month").change(function () {
    Days();
  });
  function years()
  {
    for(var i=1900;i<=2100;i++)
    {
      var str = "<option value=\"" + i + "\">" + i+ "</option>";
      $("#dr_year").append(str);
    }
  }
  function months() {
    $("#dr_month").empty();
    for (var i = 1; i <= 12; i++) {
      var str = "<option value=\"" + i + "\">" + i + "</option>";
      $("#dr_month").append(str);
    }
  }
  function Days() {
    $("#dr_day").empty();
    if (parseInt($("#dr_month").val()) == 1 || parseInt($("#dr_month").val()) == 3 || parseInt($("#dr_month").val()) == 5 || parseInt($("#dr_month").val()) == 7 || parseInt($("#dr_month").val()) == 8 || parseInt($("#dr_month").val()) == 10 || parseInt($("#dr_month").val()) == 12) {
      days = 31;
    }
    else if (parseInt($("#dr_month").val()) == 4 || parseInt($("#dr_month").val()) == 6 || parseInt($("#dr_month").val()) == 9 || parseInt($("#dr_month").val()) == 11) {
      days = 30;
    }
    else {
      if (parseInt($("#dr_year").val()) % 400 == 0 || (parseInt($("#dr_year").val()) % 4 == 0 && parseInt($("#dr_year").val()) % 100 != 0)) {
        days = 29;
      }
      else {
        days = 28;
      }
    }
    for (var i = 1; i <= days; i++) {
      var str = "<option value=\"" + i + "\">" + i + "</option>";
      $("#dr_day").append(str);
    }
  }
</script>

以上所述是小编给大家分享的jQuery时间日期三级联动效果,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
JS获取URL中的参数数据
Dec 05 Javascript
js创建一个input数组并绑定click事件的方法
Jun 12 Javascript
JavaScript中的Math.atan2()方法使用详解
Jun 15 Javascript
js如何准确获取当前页面url网址信息
Sep 13 Javascript
AngularJs学习第八篇 过滤器filter创建
Jun 08 Javascript
js创建对象几种方式的优缺点对比
Sep 28 Javascript
详解vue与后端数据交互(ajax):vue-resource
Mar 16 Javascript
在 Vue-CLI 中引入 simple-mock实现简易的 API Mock 接口数据模拟
Nov 28 Javascript
微信小程序 select 下拉框组件功能
Sep 09 Javascript
vue 解决异步数据更新问题
Oct 29 Javascript
微信小程序实现签字功能
Dec 23 Javascript
js、jquery实现列表模糊搜索功能过程解析
Mar 27 jQuery
Jquery 整理元素选取、常用方法一览表
Nov 26 #Javascript
jQuery插件扩展实例【添加回调函数】
Nov 26 #Javascript
JS扩展类,克隆对象与混合类实例分析
Nov 26 #Javascript
JS自定义混合Mixin函数示例
Nov 26 #Javascript
JS克隆,属性,数组,对象,函数实例分析
Nov 26 #Javascript
JS匿名函数类生成方式实例分析
Nov 26 #Javascript
正则表达式替换html元素属性的方法
Nov 26 #Javascript
You might like
在PHP中使用redis
2013/11/04 PHP
session在php5.3中的变化 session_is_registered() is deprecated in
2013/11/12 PHP
thinkphp实现面包屑导航(当前位置)例子分享
2014/05/10 PHP
PHP7.0版本备注
2015/07/23 PHP
php自定义中文字符串截取函数substr_for_gb2312及substr_for_utf8示例
2016/05/28 PHP
Yii实现复选框批量操作实例代码
2017/03/15 PHP
JavaScript 事件参考手册
2008/12/24 Javascript
javascript 年月日联动实现核心代码
2009/12/21 Javascript
网易JS面试题与Javascript词法作用域说明
2010/11/09 Javascript
js 函数调用模式小结
2011/12/26 Javascript
你必须知道的Javascript知识点之&quot;深入理解作用域链&quot;的介绍
2013/04/23 Javascript
JavaScript中window、doucment、body的解释
2013/08/14 Javascript
网页中可关闭的漂浮窗口实现可自行调节
2013/08/20 Javascript
JS实现图片翻书效果示例代码
2013/09/09 Javascript
购物车选中得到价格实现示例
2014/01/26 Javascript
一个非常全面的javascript URL解析函数和分段URL解析方法
2014/04/12 Javascript
Select下拉框模糊查询功能实现代码
2016/07/22 Javascript
浅析$(function) ready和onload 的区别
2016/09/03 Javascript
纯JavaScript手写图片轮播代码
2016/10/20 Javascript
ES6概念 Symbol toString()方法
2016/12/25 Javascript
bootstrap模态框示例代码分享
2017/05/17 Javascript
解析vue data不可以使用箭头函数问题
2018/07/03 Javascript
详解js静态检查工具eslint配置文件
2018/11/23 Javascript
vue组件 keep-alive 和 transition 使用详解
2019/10/11 Javascript
vue 如何使用递归组件
2020/10/23 Javascript
详解python函数传参是传值还是传引用
2018/01/16 Python
使用pycharm生成代码模板的实例
2018/05/23 Python
python频繁写入文件时提速的方法
2019/06/26 Python
CSS3媒体查询Media Queries基础学习教程
2016/02/29 HTML / CSS
锐步美国官方网站:Reebok美国
2018/01/10 全球购物
为什么会有内存对齐
2016/10/10 面试题
大学毕业生简单自荐信
2013/11/05 职场文书
好学生评语大全
2014/05/05 职场文书
普通话演讲稿
2014/09/03 职场文书
2015年度学校卫生工作总结
2015/05/12 职场文书
Pytorch中的学习率衰减及其用法详解
2021/06/05 Python