Ejecute el código jquery solo si existe div

aquí está el código html:

<div id="popup" class="popup_block" >
 <img src="images/PUB-histRIRE.jpg" alt="popup" />
</div>

y guión:

<script type="text/javascript">
    $(document).ready(function(){

            popWidth = 690;
            popHeight = 550;
            popID = 'popup';

            var popMargTop = popHeight / 2;
            var popMargLeft = popWidth / 2;

            //Apply Margin to Popup
            $('#' + popID).css({ 
                'width': popWidth,
                'height': popHeight,
                'margin-top' : -popMargTop,
                'margin-left' : -popMargLeft,
                'visibility' : 'visible'
            }); 

            //Fade in Background
            $('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
            $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer 

        //Close Popups and Fade Layer
        $('a.close, #fade, .popup_block').live('click', function() { //When clicking on the close or fade layer...
            $('#fade , .popup_block').fadeOut(); //fade them both out
            $('#fade').remove();
            return false;
        }); 

    });
    </script>

Me gusta ejecutar el código solo en la página con el div ... en la página sin este div, simplemente ignórelo. Puedo hacer un if analizando la URL ... pero me parece más complicado ... ¿algún truco simple de jquery?

preguntado el 10 de mayo de 11 a las 13:05

6 Respuestas

if($('#popup').length >0 ){
   //your code here 
}

contestado el 10 de mayo de 11 a las 17:05

La forma de hacer esto es (o era) verificar la propiedad length así:

if ($("#"+ popID).length > 0){
  // do stuff
}

contestado el 10 de mayo de 11 a las 17:05

+1 por usar su variable popID. No tiene sentido tener la variable si no la vas a usar en todas partes. ;-) - Chris

Me gusta:

if($('div#popup').length) {
    // div exists
}

contestado el 10 de mayo de 11 a las 17:05

if ($("#popup").length) {
  // do popup stuff
}

contestado el 10 de mayo de 11 a las 17:05

Si necesita una solución reutilizable simple, puede extender jQuery:

$.fn.extend({
    'ifexists': function (callback) {
        if (this.length > 0) {
            return callback($(this));
        }
    }
});

Entonces:

$('#popup').ifexists(function(elem) {
    // do something...
});

Respondido 15 Feb 18, 13:02

Esta respuesta merece más atención. El código reutilizable es el rey. - Telarian

Vamos a usar cada uno y posiblemente primeras .

Si desea ejecutar el código en cada coincidencia:

$("#popup").each(function(index, element){
    //Do stuff.  Use $(element) and/or index as necessary
});

Si desea ejecutar el código solo una vez si se encuentra una coincidencia:

$("#popup").first().each(function(index, element){
    //Do stuff.  Use $(element) as necessary.
});

Respondido 05 Oct 18, 00:10

Un selector de ID nunca tendrá múltiples coincidencias, ya que las ID deben ser únicas. - Barmar

Usar .each() en lugar de if funcionará, pero es una forma confusa de hacerlo. - Barmar

@Barmar: Usé un selector de ID como ejemplo (ya que todos los demás lo usaron como ejemplo). Por lo general, este tipo de cosas se haría con un selector de clases. - Brian

La pregunta es sobre probar la existencia de un DIV específico con una identificación, no nada con una clase. - Barmar

@Barmar: La pregunta del título del OP, "Ejecute el código jquery solo si existe div". Si bien mi solución es una solución más general para un problema muy preciso (y no un ajuste perfecto), a menudo es la solución correcta para esa pregunta (aunque no en el caso del OP). No estoy intentando ayudar al OP (¡esta pregunta tiene más de 5 años!); Estoy tratando de ayudar a los futuros visitantes de SO que quieran saber "cómo ejecutar el código jquery solo si existe un div" (para lo cual esta pregunta es el resultado de búsqueda principal). - Brian

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.