Estoy usando el siguiente código para verificar si existe una clase y, de ser así, mostrar un botón. Sin embargo, la clase solo puede existir después de que un usuario haya hecho algo en la página, por lo que nunca existirá en la carga de la página. ¿Cómo puedo ajustar este código para verificar continuamente si la clase existe y no solo en la carga de la página?
if($(".acf-gallery-attachment").length()){ return $('.acfef-submit-button').css("display", "block"); }EDITAR:
Ajusté mi código para buscar cuando el usuario hace clic en el botón de carga de archivos, pero aún no puedo hacerlo funcionar:
$('.file-custom .acf-gallery-upload').click(function () { $('.acfef-submit-button').css('display', 'block'); });No creas que esto es algo bueno, pero si buscas "verificar continuamente" algo, puedes setInterval .
setInterval(checkSomething, 1000); function checkSomething(){ if($(".acf-gallery-attachment").length()){ return $('.acfef-submit-button').css("display", "block"); } }¿Qué tal un observador de mutaciones? configurarlo para observar su contenedor y sus hijos para un cambio de clase
https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
// Select the node that will be observed for mutations const targetNode = document.getElementById('container'); // Options for the observer (which mutations to observe) const config = { attributes: true, childList: true, subtree: true }; // Callback function to execute when mutations are observed const callback = function(mutationsList, observer) { if( $('.myclass').length ){ alert('my class is available'); }else{ alert(' my class not available'); } }; // Create an observer instance linked to the callback function const observer = new MutationObserver(callback); // Start observing the target node for configured mutations observer.observe(targetNode, config); $('#btnAddClass').click(() =>{ $('#myspan').addClass('myclass'); }) $('#btnRemoveClass').click(() =>{ $('#myspan').removeClass('myclass'); }) <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id = "container"> <span id="myspan"></span> <button id="btnAddClass"> add class </button> <button id="btnRemoveClass"> remove class </button> </div>