时间戳

首页 > 解决方案 > 如何从两个引导时间选择器字段中获取持续时间

javascript - 如何从两个引导时间选择器字段中获取持续时间

问题描述

我正在使用Bootstrap 3制作表单，在其中添加了两个时间选择器。但我的问题是如何从两个输入字段中获取持续时间值。

注意：我得到的结果是second我使用 parseInt() 来获取 int 值。我怎样才能让他们像 130 = 2:10 HR

小提琴

<div class="form-group">
<label class="control-label " for="textarea">Task Time & Durations</label>
    <div class="row">
        <div class="input-group col-md-4 bootstrap-timepicker timepicker">
            <input id="timepicker1" name="start-time" type="text" class="form-control input-small">
            <span class="input-group-addon">
                <i class="glyphicon glyphicon-time"></i>
            </span>
        </div>
        <div class="input-group col-md-4 bootstrap-timepicker timepicker">
            <input id="timepicker2" name="end-time" type="text" class="form-control input-small">
            <span class="input-group-addon">
                <i class="glyphicon glyphicon-time"></i>
            </span>
        </div>
        <div class="input-group col-md-4">
            <input id="duration" name="duration" type="text" class="form-control input-small" disabled>
            <span class="input-group-addon">
                <i class="glyphicon glyphicon-time"></i>
            </span>
        </div>
    </div>
</div>

这是我的 JS 代码

$(document).ready(function(){
        $('#timepicker1,#timepicker2').timepicker({
            minuteStep: 1,
        });
        //-----------------------------------------------------------------
        $("#timepicker2").change(function(){                 
            //get value from parent form 
            var d3 = $("#timepicker1").val(); 
            var d4 = $("#timepicker2").val();       


            // calculate number of minutes for first field
            var d5 = d3.substring(0, 2);
            var d6 = d3.substring(3, 5);
            var d7 = ((parseInt(d5 )* 60) + (parseInt(d6) * 1));

            //calculate number of minutes for second field
            var d8 = d4.substring(0, 2);
            var d9 = d4.substring(3, 5);
            var d10 = ((parseInt(d8) * 60) + (parseInt(d9) * 1)) ;

            //final calculation (number of minutes)
            var d11= (d10 - d7) ;


            diff = d11; // ms per day

            //store the value to a field 
            $("#duration").val(diff);                                                            
        });    

        //-----------------------------------------------------------------
    });

标签： javascripttwitter-bootstraptimepicker

解决方案

我解决了这个感谢您的帮助工作小提琴希望这对其他人有帮助

$(document).ready(function(){
    $('#timepicker1,#timepicker2').timepicker({
        minuteStep: 1,
    });
    //-----------------------------------------------------------------
    $("#timepicker2").change(function(){                 
        //get value from parent form 
        var d3 = $("#timepicker1").val(); 
        var d4 = $("#timepicker2").val();       


        // calculate number of minutes for first field
        var d5 = d3.substring(0, 2);
        var d6 = d3.substring(3, 5);
        var d7 = ((parseInt(d5 )* 60) + (parseInt(d6) * 1));

        //calculate number of minutes for second field
        var d8 = d4.substring(0, 2);
        var d9 = d4.substring(3, 5);
        var d10 = ((parseInt(d8) * 60) + (parseInt(d9) * 1)) ;

        //final calculation (number of minutes)
        var d11= (d10 - d7) ;


        diff = d11; // ms per day

        if (diff == null) { return ""; }
        if (diff <= 0) { return ""; }
        var hours = Math.floor(diff / 60);
        var minutes = diff % 60;
        var hour = (hours > 1) ? hours + " hrs " : hours + " hr ";
        var min = (minutes > 0) ? minutes + " mins" : "";
        var duration= hour + min;

        //store the value to a field 
        $("#duration").val(duration);                                                            
    });    
});

推荐阅读