click on a button and the time appears within a div

2

I'm creating a simple electronic point system, and I'm trying to put the time within a given div, by the time the user clicks on the link, the time he clicked on this link appears inside a div. The code of my button is like this: I am using Html5 and CSS, preferably in these language, but can be in JaVASCRPIT, grateful.

<div id="entrada1">Hora da Entrada </div> 
<!-- Preciso que a hora apareça aqui-->
   <div id="botao-entrar"> 
      <div class="botao" > <a href="a definir se vai precisar" class="botao" > Entrar </a> </div>
         
    
asked by anonymous 25.08.2016 / 01:11

2 answers

2

The action can only be done with Javascript the code stays like this

    <div id="recebeHora">
    Hora da Entrada
    </div><br>
    <button onclick="pegaData()" >Entrar</button>

    <script>
    function pegaData() {
    var data = new Date();

    var hora    = data.getHours();          // 0-23
    var min     = data.getMinutes();        // 0-59
    var seg     = data.getSeconds();        // 0-59
    var mseg    = data.getMilliseconds();   // 0-999
    var tz      = data.getTimezoneOffset(); // em minutos

    // Formata a data e a hora (note o mês + 1)
    var str_hora = hora + ':' + min + ':' + seg;
    document.getElementById("recebeHora").innerHTML = "Hora da Entrada"+str_hora;
    }
    
25.08.2016 / 01:41
1

See the code below working:

$("#botao-entrar").click(function(){
   $('#datetime').html(getDataHora());
  return false;
});


function getDataHora() {
  // variáveis
  var data = new Date();
  var hora = data.getHours();
  var minutos = data.getMinutes();
  var segundos = data.getSeconds(); 
  var mes = data.getMonth()+1;
  var dia = data.getDate();
  
  // zero à esquerda se necessário
  dia = dia < 10 ? '0' + dia :  dia;
  mes = mes < 10 ? '0' + mes: mes;
  hora =  hora < 10 ? '0' + hora: hora;
  minutos = minutos < 10 ? '0' + minutos : minutos;
  segundos = segundos  < 10 ? '0' + segundos : segundos;
  
  
  // monta resultado
  var resultado = dia + "/" + mes + "/" + data.getFullYear() + " " + hora + ':' + minutos + ':' + segundos;
  
  
  return resultado;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="entrada1">Hora da Entrada </div> 


<!-- Preciso que a hora apareça aqui-->
<div id="datetime"></div>


<div id="botao-entrar"> 
      <div class="botao"> 
        <a href="a definir se vai precisar" class="botao" >Entrar</a>
      </div>
</div>
    
25.08.2016 / 01:43