Question

我在下面的格式下拉列表中有2次

Sun: Start Time::
<select name="timestart" size="1">
    <option value="08:00:00">08:00</option>
    <option value="08:30:00">08:30</option>
    <option value="09:00:00">09:00</option>
    <option value="09:30:00">09:30</option>
    <option value="10:00:00">10:00</option>
    <option value="10:30:00">10:30</option>
    <option value="11:00:00">11:00</option>
    <option value="11:30:00">11:30</option>
    <option value="12:00:00">12:00</option>
    <option value="12:30:00">12:30</option>
    <option value="13:00:00">13:00</option>
    <option value="13:30:00">13:30</option>
    <option value="14:00:00">14:00</option>
    <option value="14:30:00">14:30</option>
    <option value="15:00:00">15:00</option>
    <option value="15:30:00">15:30</option>
    <option value="16:00:00">16:00</option>
    <option value="16:30:00">16:30</option>
    <option value="17:00:00">17:00</option>
 </select><br />

和

Sun: End Time::
<select name="timestop" size="1">
    <option value="08:00:00">08:00</option>
    <option value="08:30:00">08:30</option>
    <option value="09:00:00">09:00</option>
    <option value="09:30:00">09:30</option>
    <option value="10:00:00">10:00</option>
    <option value="10:30:00">10:30</option>
    <option value="11:00:00">11:00</option>
    <option value="11:30:00">11:30</option>
    <option value="12:00:00">12:00</option>
    <option value="12:30:00">12:30</option>
    <option value="13:00:00">13:00</option>
    <option value="13:30:00">13:30</option>
    <option value="14:00:00">14:00</option>
    <option value="14:30:00">14:30</option>
    <option value="15:00:00">15:00</option>
    <option value="15:30:00">15:30</option>
    <option value="16:00:00">16:00</option>
    <option value="16:30:00">16:30</option>
    <option value="17:00:00">17:00</option>
 </select><br />

我试图在另一个输入框中显示时间差异

SunTotal:<input maxlength="255" id="sunvalue" name="inp_24771" type="text" value=""  /><br />

我在javascript下面使用

<script>


 $(document).ready(function() {    
    function calculateTime() {

        var  hourDiff = parseInt($("select[name='timestart']").val().split(':')[0],10) - parseInt($("select[name='timestop']").val().split(':')[0],10);

         document.getElementById('sunvalue').value = hourDiff;


    }
    $("select").change(calculateTime);
    calculateTime();
    });


</script>

问题是代码工作了一半，意味着只有当我在09:00和10:00两个字段中选择小时时才会显示时间，但是当我在09:30和10:30分钟选择时间时，它不起作用

Answer 1

您尚未解析分钟部分。你需要做的是抓住分钟，将它们转换成几小时（例如30小时为0.5小时），然后进行计算。

JSfiddle附在下面 https://jsfiddle.net/1r6yykmv/

function parseTime(timeString){
    var timeSections = timeString.split(':');
    var hours = timeSections[0];
    var minutes = timeSections[1];

    var timeInHours = parseFloat(hours) + parseFloat(minutes / 60);
    return timeInHours;
}

在javascript中计算2个给定时间内的差异

1 个答案: