用Javascript获取两个时间字符串之间的时间差

Question

我正在尝试创建一个具有3个输入(2个解锁和一个锁定)的表单，您将输入2个times，例如7:30AM和4:00PM，它将在第三个框中生成seconds的时间差异。

问题是，我似乎找不到一个实际计算时差的工作方法。

<script language="javascript" type="text/javascript">
$(document).ready(function(){
    function UpdateHours(){ 
        var start = $("#time1").val();
        var end = $("#time2").val();
        var dtStart = new Date("7/20/2015 " + start);
        var dtEnd = new Date("7/20/2015 " + end);
        var diff = dtEnd - dtStart;
        $("#totalTime").val(diff);
    }
    $(document).on("change, keyup", "#time1", UpdateHours);
    $(document).on("change, keyup", "#time2", UpdateHours);
});
</script>  
<input id="time1" type="text" />
<input id="time2" type="text" />
<input id="totalTime" readonly="readonly" />

这是我迄今为止在其他事情中尝试过的。能帮我一下吗?

Answer 1

您遇到的问题是您正在从另一个对象中减去一个对象。我不知道JavaScript在这种情况下决定做什么，但为了安全，您不应该依赖于这种行为，即使它确实工作。你应该做的是:

var diff = dtEnd.getTime() - dtStart.getTime();

diff将是两个日期对象之间的毫秒数。

Answer 2

$(document).ready(function(){
  
  var $time1 = $("#time1");
  var $time2 = $("#time2");
  var $diff = $("#totalTime");
  function updateHours(){   
        var dtStart = new Date("7/20/2015 " + $time1.val());
        var dtEnd = new Date("7/20/2015 " + $time2.val());
        var diff = dtEnd - dtStart;
        $diff.val(diff/1000);
  }
    $time1.add($time2).on("change, keyup", function(){
        if($time1.val() && $time2.val()){
            updateHours()
        }
    });
   
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="time1" type="text" placeholder="7:00 PM"/>
<input id="time2" type="text" placeholder="8:00 PM"/>
<input id="totalTime" readonly="readonly" />