Comparar horas inserido no campo de texto pelo horário do sistema

20 de abril de 2018 8 respostas

Diego_Henrique 20 de abril de 2018

Estou pelejando pra comparar o formato da hora que usuário colocar no campo de texto com o horário vigente, dinâmico seja do computador ou online.

Código Exemplo:

<!DOCTYPE html>
<html>

<body>
    <form onsubmit="verificar(this)">
         <input type="text" value="" maxlength="5" onkeyup="validar(this)" size="4" />
         <input type="submit" value="Teste" name="submit" />
    </form>

<script>
  function validar(hrs) {

    if (hrs.value.length == 2 || hrs.value.length == 6) {
        hrs.value += ":";
        return false;
    }
}

function verificar(obj) {
    // Obter a horaa atual à meia-noite. 
    var now = new Date();
    var hora = new Date(now.getHours(), now.getMinutes());

    // Definir horas de início/fim
    var hora1 = new Date("18:26");
    var hora2 = new Date(hora);

    // Compare as duas horas, comparando os minuitos
    // representações.
    if (now.getMinutes() > hora1 && now.getMinutes() < hora2) {
        document.write("Relógio especificado esta dentro deste intervalo.");
    } else {
        // Saída: hora especificada não está neste intervalo.
        document.write("Relógio especificado não está neste intervalo.");
        }
    }
</script>
</body>

</html>

Se alguém ja passou por isso e puder me apontar onde tô cometendo erro, por favor me avise!

8 Respostas

anon30449818 20 de abr. de 2018

Talvez eu consiga te ajudar, mas preciso que me explique melhor.

Diego_Henrique 20 de abr. de 2018 1 like

Suponhamos que, agora, são:

19:00

horas e o usuário digite:

18:50

logo de imediato o sitema acusa, e emite um alert(“Hora inválida!”). Entendeu?!

Pois não coincide com a hora do sistema operacional(19:00), ou até mesmo do celular [smartphone] que ele esteja acessando no momento.

O Código acima do qual coloquei é apenas para se ter uma idéia melhor. Mas não é necessariamente preciso reutilizá-lo. Se alguém souber e/ou tiver um meio mais prático aceito sugestões diferetemente do código-fonte que postei.

anon30449818 21 de abr. de 2018 1 like

Em resumo, o que eu faria está descrito nessa imagem:

Fiz o algoritmo aqui no meu PC, da seguinte forma:

Usar um input do tipo time;
Definir listener com evento input;
2.1. Dentro do listener, cria-se duas funções: uma para pegar o tempo do sistema e outra do usuário.
Separa horas e minutos, em arrays (x = [19, 00]; y = [18, 50]);
3.1. Situação aplica-se tanto para o tempo do sistema, quanto do usuário.
Converte-se as arrays em segundos;
Usamos uma estrutura de controle if, para comparar e ver se o horário do sistema é maior;
5.1. De acordo com o resultado, mostrar uma mensagem e mudar o estado do submit.

Aqui vai um link com meu código: https://codepen.io/JLammer/pen/jxbOBV?editors=1010

Amanhã entro no fórum, para discutirmos mais.

Diego_Henrique 21 de abr. de 2018

Realmente ficou bom d+, porquanto ficou auto-explicativo. Bem comentado e de fácil compreensão por parte do leitor.

Agora, cabe a você introduzir o código fonte direto aqui neste tópico caso venha expirar do link, ficará assegurada aqui para futura consulta.

Ficarei logado e aguardo seu contato para sanar algo a mais que tenho em mente. Att+

anon30449818 21 de abr. de 2018

Tem certeza que dá pra entender tudo? Eu posso te ajudar a entender, caso precise.

Diego_Henrique 21 de abr. de 2018

Não vejo o que explicar a mais, ja que esta tudo pronto. É só preciso observar, seguir cada linha e sua respectiva descrição. Sem segredo!

O que tenho em mente e quero lhe perguntar é - seria possível adequar a lógica com tecnologia Ajax afim de buscar a hora, provindo de algum site.

Exemplo:

http://www.horario-brasilia.com/

Nesta URL acima, ao vistoriar o código-fonte temos um elemento div com sua ID - #hora. Então queria eu saber uma fórmula de como implementar isso no script ao invés de estarmos a comparar o horário do sistema operacional local?

anon30449818 21 de abr. de 2018

Nesse ponto, já não posso ajudar, porque ainda não estudei sobre Ajax.

No entanto, acho que vale a pena fazer uma nova pergunta, no fórum. Certo?!

Diego_Henrique 21 de abr. de 2018

Mas ta valendo. Dê uma olhada nos links como referência:

Script em AJAX bem simples, contendo apenas o essencial para a aplicação através de um exemplo rápido de atualização de um botão com o horário do servidor.

Obter data e hora independente da hora do sistema

Até a próxima!

Criado 20 de abril de 2018

Ultima resposta 21 de abr. de 2018

Respostas 8

Participantes 2

8 Respostas

Topicos relacionados