Add minutes to Javascript

Question

Add minutes to Javascript

Navigation

#1 by (3 votes)
#2 by (2 votes)
#3 by (0 votes)

1

I'm doing something to calculate the sum of hours and minutes, and I see no solution.

I need to get a pasted time formatted so 09:00 , but with random time in a input and clicking on submit change the html with the input time with addition of 70 minutes. I could not get past this part and I still have not tried to add the minutes.

Can anyone help me with this mission?

<html>
<head>
<title></title>
<span> hora inicio </span>
    <script type="text/javascript">
      function hora1(){
    var horas = getElementById("hrs")
    var hr1 = horas.split(":");    // a hora sera colada com ":" no input, entao preciso dar um split, separar minutos de hora e somar 70 minutos. 
    var hr2 = hr1[0]+":"+hr1[1]; // ainda preciso somar os minutos e mostrar na exibição final com os 70 minutos a mais dessa hora do input
 m.innerHTML = hr2;
} 
    </script>
</head>
<body>
<div id="m">
  09:50
</div>
<input type="text" id="hrs">
  <button onclick="hora1()">TESTAR</button>
</body>
</html>

I got results but without the possibility of entering the time, which is not what I needed

<!--          EM JAVASCRIPT EM UM ARQUIVO PHP COM RESULTADO OK MAS RECEBENDO A HORA DO SISTEMA -->
<html>
<body>
<h2>Somar 70 minutos</h2>
<script type="text/javascript"> 
var mc = 1; 
var mc5 = 20;
var d1 = new Date(); 
var d2 = new Date();
d1.setHours(+d2.getHours()+(mc) ); 
d1.setMinutes(new Date().getMinutes()+(mc5) ); 
document.write("#resultado: " + " " + d1.getHours()+":"+d1.getMinutes());
</script>
</body>
</div>
</html>

javascript

asked by anonymous 20.11.2017 / 12:11

3 answers

Is it possible to sum the values of td using querySelectorAll? Why use Rational type?

score 3 · Answer 1

You can use the JavaScript Date object. You must first convert the received time to a timestamp . This can be done as follows:

function toTimestamp(horario){
  var aux = horario.split(':'), dt = new Date();
  dt.setHours(aux[0]);
  dt.setMinutes(aux[1]);
  dt.setSeconds(0);
  return dt.getTime();
}

The above function is given a time and returns a timestamp. A timestamp is the converted date / time in milliseconds (this is in JavaScript). So we can set 70 minutes with a timestamp too, just convert to milliseconds.

var minutosAdd = 70*60*1000; // 70 minutos em milissegundos

Now that you have the timestamp of the past hour and the timestamp of 70 minutes, just add them. We can have the plus70minutes () function that gets a string with the time and returns another string with the last time added to the 70 minutes.

function mais70minutos(hora){
  var timeHoraFinal = toTimestamp(hora) + minutosAdd;
  var dt = new Date(timeHoraFinal);
  var horaRetorno = (dt.getHours() < 10) ? '0'+dt.getHours() : dt.getHours();
  horaRetorno += (dt.getMinutes() < 10) ? '0'+dt.getMinutes(): dt.getMinutes();
  return horaRetorno;
 }

Using these functions as you see fit may cause your problem to get upset. Hope this helps. Check out link

score 2 · Answer 2

Use Moment.js to make your job easier.

See an example:

 var hora = documento.getElementById('hrs');

 var resultado = moment(hora, 'hh:mm').add(70, 'minutes').format('hh:mm')

If the hours of input are 11:30 , the result will be 12:40 .

Explaining the code

The second parameter of the moment function receives the date input format. The add function adds a quantity of time, and the second parameter informs the type (in this case it could be hours , month , years and so on), but we need to use minutes . And finally, format allows you to put the output in the required format.

MomentJS Documentation

score 0 · Answer 3

Where did I go wrong? did not work, return invalid date:

<html>
<head>
    <script src="moment.js"></script>
</head>
<body>
<h2>Somar 70 minutos</h2>
<script type="text/javascript">
function fff(){
 var hora = document.getElementById('hrs');
 var resultado = moment(hora, 'hh:mm').add(70, 'minutes').format('hh:mm');
    document.getElementById("hrs2").innerHTML = resultado;
}
</script>
<p id="hrs2"></p>
<input type="text" id="hrs">
  <button onclick="fff()">TESTAR</button>
</body>
</html>