zoukankan      html  css  js  c++  java
  • js实现下拉框联动选中日期

    html code:

    代码
    1 <form id="FormDate" action="#" name="form1">
    2 <select name="year" id="Year"
    3 onchange="setDays(this,FormDate.Month,FormDate.Day)"></select>
    4 <label>year</label>
    5 <select name="month" id="Month"
    6 onchange="setDays(FormDate.Year,this,FormDate.Day)" ></select>
    7 <label>month</label>
    8 <select name="day" id="Day"></select>
    9 <label>day</label>
    10    </form>

    js code:

    代码
    1 <script type="text/javascript">
    2 $(function () {
    3 var i = -1;
    4 //添加年份,从1910年开始
    5   for (i = 1910; i <= new Date().getFullYear(); i++) {
    6 addOption(FormDate.Year, i, i - 1909);
    7 //默认选中1988年
    8 if (i == 1988) {
    9 FormDate.Year.options[i-1910].selected = true;
    10 }
    11 }
    12 //添加月份
    13 for (i = 1; i <= 12; i++) {
    14 addOption(FormDate.Month, i, i);
    15 }
    16 //添加天份,先默认31天
    17 for (i = 1; i <= 31; i++) {
    18 addOption(FormDate.Day, i, i);
    19 }
    20 });
    21
    22 //设置每个月份的天数
    23 function setDays(year, month,day) {
    24 var monthDays = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
    25 var yea = year.options[year.selectedIndex].text;
    26 var mon = month.options[month.selectedIndex].text;
    27 var num = monthDays[mon - 1];
    28 if (mon == 2 && isLeapYear(yea)) {
    29 num++;
    30 }
    31 for (var i = day.options.length - 1; i >=num; i--) {
    32 day.remove(i);
    33 }
    34 for (var i = 1; i <= num; i++) {
    35 addOption(FormDate.Day,i,i);
    36 }
    37 }
    38
    39 //判断是否闰年
    40 function isLeapYear(year)
    41 {
    42 return (year % 4 == 0 || (year % 100 == 0 && year % 400 == 0));
    43 }
    44
    45 //向select尾部添加option
    46 function addOption(selectbox, text, value) {
    47 var option = document.createElement("option");
    48 option.text = text;
    49 option.value = value;
    50 selectbox.options.add(option);
    51 }
    52 </script>

    在公司里实习,要求每天写日报,开始时不胜其烦,现在倒是有点习惯,我也就继续保持并扩展一下,用于博客总结。

    总结:

    1.编写C#,有智能提示功能,而js没有,总是用种不安全感,自己写的是错误的。

    2.js语法与C#的差别很大,定义循环变量时总是会写成int,狂晕。

    3.学会动态的添加删除select中的option。

    虽然说比较简单,但语法不熟悉以及受其他编程语言思维的影响,发现自己也花费三四个小时,呜呼哀哉!

  • 相关阅读:
    JAVA基础——异常详解
    Android Studio如何配置adb以及常用命令
    利用Android Studio编写 Android上的c与c++程序
    启动与销毁Activity
    应用资源概览
    Android 开发者文档 -- 应用基础知识
    51单片机最小系统
    同相放大器
    反相放大器
    面向对象开发C++快速入门视频教程 C++基础加实战视频教程
  • 原文地址:https://www.cnblogs.com/qingliuyu/p/1857586.html
Copyright © 2011-2022 走看看