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

(复杂写法)如下:

<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. 拥抱.NET Core系列:依赖注入(1)

    依赖注入时编程手段中解耦和封装的一个非常重要的手段,我本人已经到了没有DI无法编写项目的程度了,在.NET Framework中微软并没有在FCL中引入DI,虽然推出了"Unity" ...

  2. JAVA - 深入JAVA 虚拟机 2

    类的两种类型的类加载器 -Java虚拟机自带的加载器 根类加载器(Bootstrap): 使用C++编写,programer can not abtain this class. 扩展类加载器(Ext ...

  3. Java纸牌小demo以及日历小demo

    //卡牌类 public class Card { //定义卡牌的点数 public static final String[] cardName = { "3", "4 ...

  4. 第一篇:webservice初探

    接触webservice也有一段时间了,为了查缺补漏,把知识点系统化,准备写几篇博文梳理下webservice的知识点,这是第一篇,对webservice进行大致的介绍. 1.什么是webservic ...

  5. CentOS7 搭建Ambari-Server,安装Hadoop集群(一)

    2017-07-05:修正几处拼写错误,之前没发现,抱歉! 第一次在cnblogs上发表文章,效果肯定不会好,希望各位多包涵. 编写这个文档的背景是月中的时候,部门老大希望我们能够抽时间学习一下Had ...

  6. python web开发之django

    上一篇介绍了python-web.py的开发,本节课我们详细说明django的开发与使用. 简介及可以学习到的内容: 1.Python下有许多款不同的 Web 框架.Django是重量级选手中最有代表 ...

  7. maven引入已经拥有的jar包

    <!-- https://mvnrepository.com/artifact/jfree/jcommon --><dependency>    <groupId> ...

  8. PHP删除文件夹及其文件

    <?php function deletedir($path){ $openpath = opendir($path); while ($f = readdir($openpath)){ $fi ...

  9. C# 代码规范和质量检查工具 StyleCop.Analyzers

    简介 原来一直用 ReSharper 来进行代码质量检查,不过毕竟是收费的,所以想找个免费的可以推广给公司的同事也一起用.搜索了一下,找到了StyleCop,但是我在 VS 2015里安装 Style ...

  10. CentOS5.5中卸载自带jdk 安装自己的jdk

    因为需要使用JDK1.6的版本,但是RedHat6.4自带的JDK是1.7版本,因此需要卸载JDK1.7,安装JDK1.6的版本,我使用的JDK1.6版本为:jdk-6u45-Linux-x64.bi ...