利用自定义函数编写年月日时间表:

(复杂写法)如下:

<body>
        
        <select id="year" size="1" style="width: 70px;"></select>
        <select id="month" size="1" style="width: 50px;"></select>
        <select id="day" size="1" style="width: 50px;"></select>
        
    </body>
    
    <script>
        //年月日选择表
        var time =new Date();
        var year_now = time.getFullYear();
        //选取元素
        var slt_year = document.getElementById('year');
        var slt_month = document.getElementById('month');
        var slt_day = document.getElementById('day');
        //利用循环确定年份范围
        for(i=1990;i<=year_now;i++){
            var opt1 = document.createElement('option');
            opt1.innerText = i;
            slt_year.appendChild(opt1);
        }
        //利用循环确定月份范围
        for(i=1;i<13;i++){
            var opt2 = document.createElement('option');
            opt2.innerText = i;
            slt_month.appendChild(opt2);
        }
        //自定义改变事件函数
        slt_year.onchange = function(){
                change();
        }
        slt_month.onchange = function(){
                change();
        }
        //自定义函数
       function change(){
            var year = slt_year.selectedOptions[0].innerText;
            var month = slt_month.selectedOptions[0].innerText;

            if(month ==4 || month ==6 || month ==9 || month ==11){
                slt_day.innerText = "";
                for(i=1;i<31;i++){
                var new_opt3 = document.createElement('option');
                new_opt3.innerText = i;
                slt_day.appendChild(new_opt3);
                }
            }else if(month==2){
                     if(year%4==0 && year%100 !=0 || year%400==0){
                 slt_day.innerText = "";
                for(i=1;i<30;i++){
                var new_opt3 = document.createElement('option');
                new_opt3.innerText = i;
                slt_day.appendChild(new_opt3);
                 }
             }
        else{
             slt_day.innerText = "";
                for(i=1;i<29;i++){
                var new_opt3 = document.createElement('option');
                new_opt3.innerText = i;
                slt_day.appendChild(new_opt3);
            }
        }
    }else{
            slt_day.innerText = "";
                for(i=1;i<32;i++){
                var new_opt3 = document.createElement('option');
                new_opt3.innerText = i;
                slt_day.appendChild(new_opt3);
             }
        }
    }

(简写写法)如下:

//自定义改变事件函数
        slt_year.onchange = function(){
                change();
        }
        slt_month.onchange = function(){
                change();
        }
        //自定义函数
        function change(){
            var year = slt_year.selectedOptions[0].innerText;
            var month = slt_month.selectedOptions[0].innerText;

        if(month ==4 || month ==6 || month ==9 || month ==11){
            add_day(30);
        }else if(month==2){
                     if(year%4==0 && year%100 !=0 || year%400==0){
                         add_day(29);
                     }else{
                         add_day(28);
                     }
                }else{
                    add_day(31);
                }
            }
        //自定义通用函数
        function add_day(i_max){
                slt_day.innerText = "";
                for(i=1;i<=i_max;i++){
                var new_opt3 = document.createElement('option');
                new_opt3.innerText = i;
                slt_day.appendChild(new_opt3);
        }
    }

巧妙利用JS中的自定义函数——化繁为简,提高效率的更多相关文章

  1. Entity Framework 6 Recipes 2nd Edition(10-5)译 -> 在存储模型中使用自定义函数

    10-5. 在存储模型中使用自定义函数 问题 想在模型中使用自定义函数,而不是存储过程. 解决方案 假设我们数据库里有成员(members)和他们已经发送的信息(messages) 关系数据表,如Fi ...

  2. js中的回调函数的理解和使用方法

    js中的回调函数的理解和使用方法 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为 ...

  3. underscore.js中的节流函数debounce及trottle

    函数节流   throttle and debounce的相关总结及想法 一开始函数节流的使用场景是:放止一个按钮多次点击多次触发一个功能函数,所以做了一个clearTimeout setTimeou ...

  4. js中如何在一个函数里面执行另一个函数

    1.js中如何在函数a里面执行函数b function a(参数c){ b(); } function b(参数c){ } 方法2: <script type="text/javasc ...

  5. 【转载】 Sqlserver中查看自定义函数被哪些对象引用

    Sqlserver数据库中支持自定义函数,包含表值函数和标量值函数,表值函数一般返回多个数据行即数据集,而标量值函数一般返回一个值,在数据库的存储过程中可调用自定义函数,也可在该自定义函数中调用另一个 ...

  6. JavaScript -- 时光流逝(七):js中的全局函数

    JavaScript -- 知识点回顾篇(七):js中的全局函数 全局函数可用于所有内建的 JavaScript 对象. (1) encodeURI():把字符串编码为 URI. <script ...

  7. js中的匿名函数和匿名自执行函数

    1.匿名函数的常见场景 js中的匿名函数是一种很常见的函数类型,比较常见的场景:   <input type="button" value="点击" id ...

  8. SparkSQL中的自定义函数UDF

    在Spark中,也支持Hive中的自定义函数.自定义函数大致可以分为三种: UDF(User-Defined-Function),即最基本的自定义函数,类似to_char,to_date等 UDAF( ...

  9. JS中关于把函数作为另一函数的参数的几点小总结

    //JS中关于把函数作为函数的参数来传递的问题的小总结//第一,最简单的形式无参函数,直接形式函数的函数名放到括号中,再在执行部分这个函数即可.//当然调用时要穿另一个真正的定义好的函数/*funct ...

随机推荐

  1. Scratch2的离线下载与安装

    scratch是一种程序设计语言,可以用来设计 故事.动画.游戏.音乐和美术作品. Scratch主页:https://scratch.mit.edu/ Scratch的下载与安装: 首先下载并安装A ...

  2. angular4.0 父子组建之间的相互通信

    父组建---->子组建 传递信息 首先先通过angular脚手架生成两个基本组件,有一个好处是 会自动关联到跟模版,节约时间,而且还是偷懒 ng generate component compo ...

  3. MyBatis源码解析【1】准备工作

    终于迎来了这一天,我觉得现在的我在经历了长时间的学习和开发之后有了一定的经验,所以准备开始学习源码. 今天我将做好充足的准备,在接下来的一个月中,努力的爬过这座大山.(可能不用一个月,但是我觉得需要仔 ...

  4. 自定义MapReduce中数据类型

    数据类型(都实现了Writable接口) BooleanWritable 布尔类型 ByteWritable 单字节数值 DoubleWritable 双字节数值 FloatWritable 浮点数 ...

  5. 打造属于自己的支持版本迭代的Asp.Net Web Api Route

    在目前的主流架构中,我们越来越多的看到web Api的存在,小巧,灵活,基于Http协议,使它在越来越多的微服务项目或者移动项目充当很好的service endpoint. 问题 以Asp.Net W ...

  6. 关于移动APP与Web APP的测试重点以及区别

    Web app测试重点: 1. 功能测试:功能的实现是否满足需求. 2. 性能测试: 2.1 链接速度测试:测试页面链接的速度 2.2 负载测试:web应用系统能允许多少个用户同时在线?超过这个数量会 ...

  7. redhat系列linux系统 修改主机名的正确方法

    ##注:无特别说明,以下称呼的linux系统统一视为redhat系linux redhat系列linux系统 如果想修改主机名 很多人可能都会以为是: $hostname NEW-NAME 或者在 / ...

  8. Java使用拦截器的两种方式

    拦截器是个好东西,之前用到过,现在记录一下,供以后参考使用! 其一,使用org.aspectj.lang.annotation.Aspect 先上代码: package com.test.interc ...

  9. JavaSE的基础语法之标识符:

    标识符(掌握) (1)就是给类,接口,方法,变量等起名字的字符序列 (2)组成规则: A:英文大小写字母 B:数字 C:$和_ (3)注意事项: A:不能以数字开头 B:不能是java中的关键字 C: ...

  10. Maven “Failed to execute goal org.apache.maven.plugins:maven-archetype-plugin:2.4:create...”问题总结

    今天学习Maven的过程中,一直遇到一个问题:用maven指令构建新项目时,一直报错,用的 Maven 3.2 , JDK 6. 构建的命令: 错误信息: 解决方案: 在StackOverFlow上找 ...