時間更改

需求:

點擊研究週期的年月日,結束時間對應加減年月日


藉助插件: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);
            })
   


四行代碼,就替代了之前的一堆,想法真的很可怕,算法更可怕


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章