我有这段代码,我添加了两个具有时间类型的输入,我尝试将它们加在一起,这就是我在下面附加的内容。

任何人都有一个想法,我将在下面介绍。



   setInterval(function () {
        sum_diff();
    }, 1000);


function sum_diff() {

       zxc = document.getElementById("id_actual_1").value;
       xcz = document.getElementById("id_actual_2").value;
       czx= document.getElementById("id_actual_3").value;

       zxc = zxc.split(":");
       xcz = xcz.split(":");
       czx = czx.split(":");

       var zxcDate = new Date(0, 0, 0, zxc[0], zxc[1], 0);
       var xczDate = new Date(0, 0, 0, xcz[0], xcz[1], 0);
       var czxDate = new Date(0, 0, 0, czx[0], czx[1], 0);

       var diff = zxcDate.getTime() + xczDate.getTime  + czxDate.getTime;
       	var hours = Math.floor(diff / 1000 / 60 / 60);
        diff -= hours * 1000 * 60 * 60;

        var minutes = Math.floor(diff / 1000 / 60);

               return (hours < 9 ? "0" : "") + hours + ":" + (minutes < 9 ? "0" : "") + minutes;
 }

  setInterval(function () {
        document.getElementById("id_sum_actual").value =  sum_diff();
    }, 1000);

<input type="time" id="id_actual_1" />
<input type="time" id="id_actual_2" />
<input type="time" id="id_actual_3" />
<input type="time" id="id_sum_actual" readonly />





加上如何在JavaScript端循环代码?

最佳答案

我不知道为什么要使用setInterval,但这不是监视事件的好方法。而是使用事件监听器,例如下面的示例。

在这里,我将时间转换为毫秒并检索小时和分钟


      function msToTime(duration) {
        var minutes = Math.floor((duration / (1000 * 60)) % 60),
            hours = Math.floor(duration / (1000 * 60 * 60));

        hours = hours < 10 ? "0" + hours : hours;
        minutes = minutes < 10 ? "0" + minutes : minutes;


        return hours + ":" + minutes;
      }
      console.log(msToTime(300000));
      function sum_diff() {
        zxc = document.getElementById("id_actual_1").value;
        xcz = document.getElementById("id_actual_2").value;
        czx = document.getElementById("id_actual_3").value;

        zxc = zxc.split(":");
        xcz = xcz.split(":");
        czx = czx.split(":");

        var zxcDate = new Date(0, 0, 0, zxc[0], zxc[1], 0);
        var xczDate = new Date(0, 0, 0, xcz[0], xcz[1], 0);
        var czxDate = new Date(0, 0, 0, czx[0], czx[1], 0);

        var zxcMs =
          zxcDate.getHours() * 60 * 60 * 1000 +
          zxcDate.getMinutes() * 60 * 1000;
        var xczMs =
          xczDate.getHours() * 60 * 60 * 1000 +
          xczDate.getMinutes() * 60 * 1000;
        var czxMs =
          czxDate.getHours() * 60 * 60 * 1000 +
          czxDate.getMinutes() * 60 * 1000;

        var ms = zxcMs + xczMs + czxMs;

        return msToTime(ms);
      }

      var elements = document.getElementsByClassName("time");
      for (var i = 0; i < elements.length; i++) {
        elements[i].addEventListener("change", function(e) {
          document.getElementById("id_sum_actual").value = sum_diff();
        });
      }
 

<input class="time" type="time" id="id_actual_1" value="00:00" />
<input class="time" type="time" id="id_actual_2" value="00:00" />
<input class="time" type="time" id="id_actual_3" value="00:00" />
    <input type="text" id="id_sum_actual" readonly />

关于javascript - 使用时间类型-html添加输入值,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/59707111/

10-12 07:37
查看更多