Tengo dos botones diferentes en el menú de navegación, son enlaces de anclaje a un selector de pestañas en la página de inicio, que tiene dos pestañas. Necesito los botones de navegación para cambiar la pestaña activa, cuando se hace clic. Debería ser un código simple, pero soy un novato en JS.
Necesito esto para llamar a las funciones después de que se cargue la página, de esta manera, también funcionará desde otras páginas, no solo desde la página de inicio.
La primera función funciona en sí misma como debería. La función también funciona cuando se hace clic en el botón en una página diferente. Llama a la página de inicio, luego cambia la pestaña activa después de cargar la página:
add_action( 'wp_footer', function () { ?> <script> jQuery('#menu-item-15507 a').on('click', window.onload=function myfunction_1() { jQuery( '#one-to-one a' ).click(); return true; }); </script> <?php } );Pero cuando agrego el segundo evento y la función, las pestañas no cambian al cargar la página. Funciona en la misma página (página de inicio), pero no cuando se activa desde una página diferente:
add_action( 'wp_footer', function () { ?> <script> jQuery('#menu-item-15507 a').on('click', window.onload=function myfunction_1() { jQuery( '#one-to-one a' ).click(); return true; }); jQuery('#menu-item-16848 a').on('click', window.onload=function myfunction_2() { jQuery( '#courses a' ).click(); return true; }); </script> <?php } );¿Cómo se supone que debo cambiar el código para que ambas funciones funcionen también en la carga de la página?
Un problema es que no invoque a los on- -setters si necesita ejecutar más de una función, use addEventListener en su lugar.
Pero asignar a .onload dentro de un detector de clics no tiene ningún sentido de todos modos: para cuando el usuario pueda hacer clic, es probable que la ventana se haya cargado de todos modos.
La forma estándar de ejecutar algo cuando la página está lista en jQuery es usar la devolución de llamada de la función $ principal.
$(() => { const clickOne = () => $('#one-to-one a').click(); clickOne(); $('#menu-item-15507 a').on('click', clickOne); const clickCourses = () => $('#one-to-one a').click(); clickCourses(); $('#courses a').on('click', clickCourses); });