jQuery/Javascript: detecta si el aviso html de la tienda WooCommerce está visible

2 minutos de lectura

Estoy buscando una forma de determinar con JavaScript/jQuery si se muestra el aviso de la tienda WooCommerce. El HTML para el aviso de la tienda se ve así…

<p class="woocommerce-store-notice demo_store" style="display: block;">
    This is a store notice
</p>

He intentado hacer esto usando lo siguiente…

jQuery(document).ready(function(){
    if ( jQuery('.woocommerce-store-notice').css('display') == 'none') {
        console.log('Store Notice Hidden');
    } else {
        console.log('Store Notice Visible');
    }
});

Pero esto me dice que el aviso está oculto cada vez, incluso cuando está visible.

¿Podría esto tener algo que ver con la forma en que se muestra el aviso de la tienda? ¿Tal vez se configura después de que el dom se haya cargado?

  • bueno, ¿cuándo o en qué caso se muestra esta notificación?

    – Mihai T.

    14 de agosto de 2018 a las 12:04

  • lo probé jsfiddle y funciona bien Tal vez el problema es dónde se encuentra el script jquery en el código.

    – Thanasis1101

    14 de agosto de 2018 a las 12:05

  • La notificación se muestra en la carga de la página, pero su valor de visualización parece estar configurado en línea usando Javascript. Voy a tratar de averiguar dónde se establece ahora

    – fightstarr20

    14 de agosto de 2018 a las 12:06

  • esa es la clave para saber cuándo se muestra y puede usar ese evento. Pero podrías intentar usar window.on('load') en vez de ready

    – Mihai T.

    14 de agosto de 2018 a las 12:07

El elemento se elimina cuando el aviso de la tienda está deshabilitado. el css display la propiedad no está disponible por lo tanto undefined. Pruebe el siguiente código

jQuery(document).ready(function(){
    if ( jQuery('.woocommerce-store-notice').css('display') == undefined) {
        console.log('Store Notice Hidden');
    } else {
        console.log('Store Notice Visible');
    }
});

  • Bienvenido de nuevo Henna 🙂

    – LoicTheAztec

    14/08/2018 a las 16:40

  • @LoicTheAztec Es una locura que todavía me recuerdes 🙂 Por cierto, estás trabajando en temas de woocommerce

    – hemnath mouli

    15 de agosto de 2018 a las 6:08

Verifícalo con

if(jQuery('.woocommerce-store-notice').is(':visible')){

}

else{

}

Puedes encontrar lo que buscas aquí:

http://api.jquery.com/selector-visible/

Por cierto => JQuery: si div es visible

¿Ha sido útil esta solución?

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Configurar y más información
Privacidad