您的位置:首页 > Web前端 > JavaScript

时间更改

2017-08-25 09:56 204 查看
需求:

点击研究周期的年月日,结束时间对应加减年月日



借助插件:moment.js. moment.js 是一个 JavaScript 日期处理类库,用于解析、检验、操作、以及显示日期

我最初的做法:

1、把结束时间先存起来

2、分别监听研究周期年月日的input,当年增加就给结束时间加上年,如果月也增加,把年先保存起来赋值给结束时间,拿这个新的结束时间给月作为结束时间来加月,以此类推

3、这样做会导致加了年之后再加月,又回来加年,计算就会出乱

粘贴一段很恶心的代码

//最初的结束时间

        var initEndTime = $("[name='endTime']").val();

        //改变日的结束时间

        var dayEndTime; 

        //改变月的结束时间

        var monthEndTime;

        //改变年的结束时间

        var yearEndTime;

        $("#researchCycle input").on("change",function(){

            if($(this).attr("name") === "researchDay" ){

                if(dayEndTime){

                    var now = moment(dayEndTime);

                }else{

                    var now = moment(initEndTime);

                }

                var thisVal = $(this).val();

                var changTime = parseInt( thisVal - 最初天数);

                now.add(changTime,'d')

                var end = now.format("YYYY-MM-DD HH:mm:ss").toString()

                monthEndTime = end;

                yearEndTime = end;

                $("[name='endTime']").val(end);

            }

            if($(this).attr("name") === "researchMonth"){

                if(monthEndTime){

                    var now = moment(monthEndTime);

                }else{

                    var now = moment(initEndTime);

                }

                var thisVal = $(this).val();

                var changTime = parseInt( thisVal - 最初月数);

                now.add(changTime,'M')

                var end = now.format("YYYY-MM-DD HH:mm:ss").toString()

                yearEndTime = end;

                dayEndTime = end;

                $("[name='endTime']").val(end);

            }

            if($(this).attr("name") === "researchYear"){

                if(yearEndTime){

                    var now = moment(yearEndTime);

                }else{

                    var now = moment(initEndTime);

                }

                var thisVal = $(this).val();

                var changTime = parseInt( thisVal - 最初年数);

                now.add(changTime,'y')

                var end = now.format("YYYY-MM-DD HH:mm:ss").toString()

                dayEndTime = end;

                monthEndTime =end;

                $("[name='endTime']").val(end);

最终的做法:

经过了各种琢磨,各种放弃,发现自己脑袋不会转弯,那么简单的问题想那么复杂

解决思路:

1、开始时间是不变的,结束时间 = 周期 + 开始时间

2、定义一个年月日的变量,监听研究周期的input,不管哪个改变都给结束时间加上对应的年月日

//周期改变结束时间也跟着改变

            var startTime = $("[hhitdataname='startTime']").val();

            $("#researchCycle input").on("change",function(){

                var now = moment(startTime);

                var curYearVal = $("[name='researchYear']").val();

                var curMonthVal = $("[name='researchMonth']").val();

                var curDayVal = $("[name='researchDay']").val();

                now.add(curYearVal,'y')

                now.add(curMonthVal,'M')

                now.add(curDayVal,'d')

                var end = now.format("YYYY-MM-DD HH:mm:ss").toString()

                $("[name='endTime']").val(end);

            })   

四行代码,就替代了之前的一堆,想法真的很可怕,算法更可怕
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  moment.js