¿Recargar una página con jQuery pulsando sobre un elemento? En muchas ocasiones necesitamos hacer un refresh o reload (recarga) de una página al pulsar sobre un elemento.
Normalmente, si queremos cargar nuevo contenido procedente de una consulta RANDOM, un reload cargará nuevos contenidos al recargar la página. ¿Cómo podemos facilitar esta opción a nuestros usuarios? Básicamente, con un botón o con un enlace que, al pulsar regenere los contenidos recargando la página.
¡Vamos a ver cómo implementarlo!
Vídeo tutorial para recargar una página con jQuery pulsando sobre un elemento:
Código PHP para tu Child Theme:
Recarga una página con jQuery cuando pulsamos sobre un elemento.
/*
* woofreelance.academy - Recarga página pulsando un elemento
*/
add_action('wp_footer', 'uniwpbotonrecarga_name');
function uniwpbotonrecarga_name(){
?>
<?php $reloadurl=strtok($_SERVER["REQUEST_URI"],'?');?>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$(".btn-recarga").click(function(){
window.location.href = 'https://tudominio.com/<?php echo $reloadurl;?>'
});
});
</script>
<?php
};
Paso a paso:
1. Añade el código PHP en el archivo functions.php de tu plantilla WordPress.
2. Reemplaza https://tudominio.com/ por el dominio de la web en la que estás trabajando.
3. Añade la clase .btn-recargar al elemento de la página que recargará la web, por ejemplo, un botón.
¿Dónde y cómo usarlo?
¿En qué casos podemos necesitar recargar una página con jQuery pulsando sobre un elemento? Pues depende de las necesidades del proyecto, pero, por ejemplo, en páginas con tests o preguntas que se generan de forma aleatoria (RANDMOM), sería muy útil que el usuario pudiese decidir si quiere hacer ese test o responder esas preguntas, o si ya las sabe y desea hacer o responder otras.
También podemos necesitar recargar la página porque deseamos mostrar un nuevo contenido o el contenido de nuestra web se refresca cada pocos minutos, por ejemplo, una web de noticias, un foro de discusión, una web de contenidos aportados por los usuarios, etc. ¿Se te ocurre otro caso en el que poder utilizar esta funcionalidad? ¡Déjala en comentarios!
