Input time

Front-end
, ,
#1

Estou aprendendo a liguagem Javascript, desenvolvi ate onde aprendi dois intput time.
intputTime
Quero saber se tem como ao clicar no botao “Calcular” ele poderia está subtraindo a horaInicial - horaFinal.
Consegui pegar os valores da hora mas quando vou fazer a subtração dar erro.NaN.
Desde já agradeço.

#2

Bom dia, isso esta acontecendo porquê inputs do tipo time não retornam números, e sim uma string, com esse formato: 00:00.

Para resolver isso você tem que remover os dois pontos e então fazer o cálculo, mais ou menos assim:

<label for="init">Inicio: </label>
<input type="time" name="init" id="init" />

<label for="end">Fim: </label>
<input type="time" name="end" id="end" />

<button onclick="calcular();">Calcular</button>

<span id="resultado" ></span>

<script type="text/javascript" >
function calcular() {
    // Pega os dois inputs do tipo time.
    const init = document.getElementById("init"); 
    const end = document.getElementById("end");

    // Pega os valores dos inputs e substitui os dois pontos por uma string vazia,
    // depois faz o cálculo para obter o valor desejado.
    const result = (end.value.replace(":", "")) - (init.value.replace(":", "")) + "";
   
    // Pega a metade da string.
    const metade = Math.floor(result.length / 2);

    // Pega a primeira parte da string e concatena ela com os dois pontos,
    // em seguida pega a segunda parte da string e a concatena também.
    document.getElementById("resultado").innerHTML =
        result.substr(0, metade) + ":" + result.substr(metade);
}
</script>
1 curtida
#3

Opa meu amigo.
Deu certo, muito obrigado.
Você poderia me recomendar algo relacionado a tecnologia javascript?
cursos, livros.
estou interessado em aprender react native.
Se puder me indicar algo, desde ja agradeço!

#4

Cara, eu não sou a pessoa mais indicada para recomendar coisas relacionadas a JS, já que só sei o básico, mas o curso que eu fiz foi esse.

Pergunta aqui mesmo no fórum sobre cursos, livros e etc, tenho certeza que alguém mais qualificado que eu vai te responder.

1 curtida