Estoy usando el código jquery para hacer menús desplegables en los filtros de la barra lateral. este código funciona correctamente, pero después de seleccionar un filtro, este código no funciona, creo que debido a la llamada ajax. que es solucion por favor guíame
jQuery(function(){ jQuery("#sidebar h4, #sidebar h3, body.woocommerce #sidebar>div>.inner .widget h4, body.woocommerce #sidebar>div>.inner .widget h3").on('click', function(){ jQuery(this).parent().toggleClass("dropdown-hide"); }); });jQuery(document).on('click', "SELECTOR", function(event){ });Esto vincula un evento de clic al documento y todos los elementos secundarios dentro de él. Este método también funcionará con elementos creados dinámicamente.
Trabajando con jQuery(document).on( eventos
jQuery(function(){ setTimeout(function () { jQuery('.btn-group').html('<button class="btn-default">Click</button>') }, 1000); jQuery(document).on('click', ".btn-default", function(event){ console.log('clicked'); }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="btn-group"></div> No funciona con jQuery(selector).on( eventos
jQuery(function(){ setTimeout(function () { jQuery('.btn-group').html('<button class="btn-default">Click</button>') }, 1000); jQuery(".btn-default").on('click', function(){ console.log('clicked'); }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="btn-group"></div>Entonces, tienes que cambiar como abajo
jQuery(document).on('click', "#sidebar h4, #sidebar h3, body.woocommerce #sidebar>div>.inner .widget h4, body.woocommerce #sidebar>div>.inner .widget h3", function(event){ });