Estoy tratando de agregar una marca de tiempo en el campo de entrada de la casilla de verificación como valor. Pero siempre muestra el mismo valor.
¿Cómo agregar un valor diferente (en blanco) mientras se desmarca?
Aquí está el código HTML,
<div class="flex items-center mb-4 newsletter-check"> <input type="checkbox" id="newsletter" name="join-my-newsletter" class="form-check" value="Yes"> <label class="form-check-label" for="newsletter">Join my newsletter</label> </div>Usé el javascript
$(function() { // when page loads var timeNow = new Date().getTime(); $(".newsletter-check input[type='checkbox']").on("click",function() { if (this.checked) $("#newsletter").attr('value', + timeNow ); }); });Puedes probar este código:
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(document).ready(function(){ $(".newsletter-check input[type='checkbox']").on("click",function() { var timeNow = new Date().getTime(); if ($(this).prop('checked')==true){ $("#newsletter").attr('value', timeNow ); alert(timeNow); }else{ $("#newsletter").attr('value', ''); } }); }); </script> </head> <body> <div class="flex items-center mb-4 newsletter-check"> <input type="checkbox" id="newsletter" name="join-my-newsletter" class="form-check" value="Yes"> <label class="form-check-label" for="newsletter">Join my newsletter</label> </div> </body> </html>La marca de tiempo se establece en la carga de la página para que no se actualice.
Puede mover la declaración de marca de tiempo dentro del evento de clic para que se actualice cada vez que active la casilla de verificación .
$(function() { // when page loads $(".newsletter-check input[type='checkbox']").on("click",function() { var timeNow = new Date().getTime(); console.log(timeNow); if (this.checked) $("#newsletter").attr('value', + timeNow ); }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <div class="flex items-center mb-4 newsletter-check"> <input type="checkbox" id="newsletter" name="join-my-newsletter" class="form-check" value="Yes"> <label class="form-check-label" for="newsletter">Join my newsletter</label> </div>