0

Estou criando um relógio a partir de um valor informado, o problema é que o relógio não esta sendo atualizado.

O outro problema é que na exibição fica invertido, o mês esta vindo primeiro que o dia.

O que estou fazendo de errado? Esse valor "Hoje"e exibido corretamente e vem do servidor, não posso pegar o valor do cliente por causa do risco de alteração da data do computador.

function relogio() {

    var valor = document.getElementById('Hoje').value;

    var data = new Date(valor);

    var dia = data.getDate();
    var mes = data.getMonth() + 1;
    var ano = data.getFullYear();


    var horas = data.getHours();
    var minutos = data.getMinutes();
    var segundos = data.getSeconds();


    if (dia < 10) {
        dia = "0" + dia;
    }
    if (mes < 10) {
        mes = "0" + mes;
    }
    if (horas < 10) {
        horas = "0" + horas;
    }
    if (minutos < 10) {
        minutos = "0" + minutos;
    }
    if (segundos < 10) {
        segundos = "0" + segundos;
    }

    var dataAtualizada = dia + '/' + mes + '/' + ano + ' ' + horas + ':' + minutos + ':' + segundos;

    document.getElementById('relogio').innerHTML = dataAtualizada;
}

window.setInterval(relogio(), 1000); 
8
  • tente fazer assim: window.setInterval(relogio, 1000); 7/12/2018 às 12:22
  • @MáttheusSpoo dessa forma, se não passar o valor da certo. Mas se passar não da.
    – mba
    7/12/2018 às 12:25
  • ... Não entendi. Quando você usa o setInterval, deve passar o nome da função, ou declarar ela dentro do setInterval. Se você usa o () dentro da função, ele não vai executar a função a cada 1 segundo, vai executar na hora que ele ler a linha e depois vai dar erro a cada 1 segundo. 7/12/2018 às 12:28
  • @MáttheusSpoo Entendi, mas o problema esta aqui. var data = new Date(valor);, quando não passo esse valor, do modo que vc falou sem () atualiza, quando passo o valor ele não atualiza, só exibe e não mostra nenhum erro.
    – mba
    7/12/2018 às 12:35
  • Só para entendimento, qual é o valor que está na variável valor? Sei que está pegando do elemento, mas o que tem no elemento "hoje"? a data de hoje? se for o caso, você pode simplesmente fazer new Date() que ele pega o dia/hora atual do navegador. 7/12/2018 às 12:36

1 Resposta 1

0

Ok, segue o código.

document.getElementById('relogio').value = document.getElementById('Hoje').value

function relogio() {
    var valor = document.getElementById('relogio').value.split(' '); //divide dia/horário
    var dia = valor[0].split('/').reverse().join('-'); //converte a data em formato americano
    valor = dia + ' ' + valor[1]; //une a data americana com o horário
    var data = new Date(valor); // cria o objeto de data
    var atualizado = data.setSeconds(data.getSeconds() + 1) // adiciona um segundo
    atualizado = new Date(atualizado) //cria a data atualizada
    document.getElementById('relogio').value = atualizado.toLocaleDateString('pt-BR', {hour: 'numeric', minute: 'numeric', second: 'numeric'}); //atualiza a data já editada pro formato solicitado
}

setInterval(relogio, 1000) //roda a cada 1 segundo.
<input class="form-control input-print larg" type="text" id="Hoje" style="display:none" value='12/07/2018 11:30:00'/>
<input class="form-control input-print" id="relogio" type="text" readonly>

Seu principal erro foi receber a hora de uma string, mas não aumentar um segundo nela. Se você recebe o horário do servidor e coloca dentro de uma tag html dentro da página, precisa garantir que ela vai ser atualizada pelo servidor, ou pelo javascript. Como o servidor não atualiza, editamos a string para colocar num objeto de data, adicionamos um segundo no valor dela, e retornamos a string pro valor original. Vou deixar alguns links para que possa estudar e entender o que foi feito, mas creio que com os comentários dá pra ter uma noção.

Só quero deixar claro que o relógio vai atualizar no front end, então se a hora do servidor for modificada a pagina precisa ser recarregada.

Links úteis:

.toLocaleDateString()

Objeto Date

1
  • Obrigado Máttheus, funcionou perfeitamente. Parabéns.
    – mba
    7/12/2018 às 14:22

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .