2009-06-22 22 views
7

Estoy teniendo una estructura div simple (ver a continuación). Todo lo que trato de hacer es cuando se hace clic en el id. De div. "Entrevistador-Botón"; deben aparecer los siguientes div y cuando se hace clic en div div "elt" divs de id "parent0" hasta que el final se oculte.Oculto divs padres en Jquery

La parte de la pantalla funciona bien. Sin embargo, cuando intento esconderme, NO se oculta. Cuando hago clic en el identificador div "elt", aparece el mensaje de alerta "hh" (ver más abajo). Extraño. ¿Alguna ayuda sobre cómo ocultar esto?

<div id = "interviewer-Button"> 
    Interviewer 
    <div id = "parent0"> 
     Viv 
      <div id = "parent1"> 
       Parent 
       <div id = "elt"> 
        Close 
       </div> 

      </div>           
    </div>                
</div>  


<script> 
$(document).ready(function() { 
    $("#parent0").hide(); 
    $("#interviewer-Button").click(function() { alert("hh");$("#parent0").show(); }); 
    $("#elt").click(function() { 
      $(this).parent().parent().hide(); 
     });     
    }); 
</script> 

Respuesta

21

Debe detener la propagación del evento click en el controlador para el elemento interno. Sin eso, también se invocará el controlador para el padre. Vea el jQuery event object para más información.

$("#elt").click(function (e) { 
    e.stopPropagation(); 
    $(this).parent().parent().hide(); 
}); 
0

n/aSe usa una combinación de las anteriores. Gracias a ambos miembros por sus respuestas. gran ayuda.

  jQuery(function ($) { 
       $('.coffee-strength p span').each(function() { 
        var string = $.trim($(this).text()); 
        if(string!="22"){ 
         $(this).html('<img src="/images/' + string + '.png" alt="' + string + '" />'); 
        }else{ 
         $(this).parent().parent().hide();  
        } 
        }); 

      }); 

      </script> 
0

También puede tomar ventaja de la propagación de eventos y adjuntar un solo evento:

$(function() { 
    $("#parent0").hide(); 
    $("#interviewer-Button").on('click', function(e){ 
    $(this).find('#parent0').toggle(e.target.id !== 'elt'); 
    }); 
});