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

(复杂写法)如下:

<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. 正则表达式获取body内容

    最近项目需要,要弄个正则表达式获取body的内容. 用过angularjs就知道,很多时候要写指令时引用templateUrl的时候.template的内容root是不能包含多个节点的,否则就报错. ...

  2. Java 中基本类型和字符串之间的转换

    Java 中基本类型和字符串之间的转换 在程序开发中,我们经常需要在基本数据类型和字符串之间进行转换. 其中,基本类型转换为字符串有三种方法: 1. 使用包装类的 toString() 方法 2. 使 ...

  3. POJ 2289 Jamie's Contact Groups / UVA 1345 Jamie's Contact Groups / ZOJ 2399 Jamie's Contact Groups / HDU 1699 Jamie's Contact Groups / SCU 1996 Jamie's Contact Groups (二分,二分图匹配)

    POJ 2289 Jamie's Contact Groups / UVA 1345 Jamie's Contact Groups / ZOJ 2399 Jamie's Contact Groups ...

  4. JS - 讨论 - 编码习惯 - JavaScript代码到底要不要写分号?

    如题:烦请大家在评论区给出原创意见!多谢!

  5. android6.0动态权限处理<一>

    android 6.0以上为了保护用户的隐私,和以往被人诟病的权限机制,确立了新的权限机制.从 Android 6.0(API 级别 23)开始,用户开始在应用运行时向其授予权限,而不是在应用安装时授 ...

  6. Python基础之常用模块(三)

    1.configparser模块 该模块是用来对文件进行读写操作,适用于格式与Windows ini 文件类似的文件,可以包含一个或多个节(section),每个节可以有多个参数(键值对) 配置文件的 ...

  7. 数位dp模板 [dp][数位dp]

    现在才想到要学数位dp,我是不是很弱 答案是肯定的 以一道自己瞎掰的题为模板 //题: //输入数字n //从0枚举到n,计算这n+1个数中含有两位数a的数的个数 //如12930含有两位数93 #i ...

  8. 从零开始搭建Jenkins+Docker自动化集成环境

    本文只简单标记下大概的步骤,具体搭建各个部分的细节,还请自行搜索.第一.二部分只是对Jenkins和Docker的简单介绍,熟悉的同学请直接跳到第三部分. 一.关于Jenkins Jenkins简介 ...

  9. Sping之Ioc

    Ioc,控制反转,依赖注入! 作用:降低代码之间的耦合性 代码永远是最好的示例: 1.新建test类 package demo; public class test { String string_v ...

  10. 设计模式--单例模式(Singleton pattern)及应用

    单例模式 参考文档: 该文仅介绍spring的单例模式:spring 的单例模式 介绍原理:Spring的单例模式底层实现 参考书籍:漫谈设计模式:从面向对象开始-刘济华.pdf 1. 单例模式解析 ...