Para empezar, tengo un formulario de contacto que se ve así:
El código contact form 7 editor es:
<input type="checkbox" id="katoikia" name="tracking-777">Tracking Acceptance</input> <label> Your Name: [text* your-name] </label> <label> Email: [email* your-email] </label> <label> Subject [text* your-subject] </label> <label> Your message (optional): [textarea your-message] </label> [submit "Submit"] Quiero verificar si la casilla de verificación que tengo está marcada y, si está marcada, quiero rastrear los campos del formulario de contacto. Pero lucho por encontrar una manera de lograr la verificación de la if statement .
Usé esta pieza de javascript pero no funciona en absoluto:
<script> $(document).ready(function() { $('#katoikia').change(function() { // CHANGED THIS SELECTOR if ($('#katoikia').is(':checked')) { alert('Checked'); } else { alert('Unchecked!'); } }); }); </script>Pregunta : ¿Cómo puedo verificar si la casilla de verificación está marcada o no y, en consecuencia, hacer 'algo'?
Nota : siéntase libre de dar una breve explicación de dónde o por qué debo usar lo que me sugiera, además asegúrese de informarme si usar el código en el contact form 7 editor está bien o no.
Tu JS puro es correcto. Tal vez el campo de entrada no se represente cuando su JS se ejecuta por primera vez. Esa podría ser la razón por la cual el controlador de eventos (cambio) no está configurado. Pruebe el siguiente JS:
$(document).ready(function() { $(document).on("change", "#katoikia", function() { // CHANGED THIS SELECTOR if ($('#katoikia').is(':checked')) { alert('Checked'); } else { alert('Unchecked!'); } });});
PD: la entrada es una etiqueta de cierre automático. Así que quita la etiqueta de cierre. Más información aquí .
Su jQuery es incorrecto para el uso en WordPress. Puede insertarlo en el editor de CF7, pero recomendaría minimizarlo para que cf7 no lo auto-p.
No puedes simplemente usar $ en Wordpress.
<script> jQuery(function($) { $('#katoikia').on('change', function() { // CHANGED THIS SELECTOR if ($('#katoikia').is(':checked')) { alert('Checked'); } else { alert('Unchecked!'); } }); }); </script>Minificado se vería así:
<script>jQuery(function(e){e("#katoikia").on("change",function(){e("#katoikia").is(":checked")?alert("Checked"):alert("Unchecked!")})});</script>