Problème contextuel: ne pas afficher le contenu correspondant correct

Question

En cours d'itération sur un tableau, j'imprime du contenu div pour chaque itération. Chaque fois que l'utilisateur clique sur un contenu div, une fenêtre contextuelle devrait apparaître et devrait afficher le contenu correspondant dans la fenêtre contextuelle du tableau.

ci-dessous est mon code,

foreach ($email as $client) 
{ 

       echo "<div class = 't'> Show more....... </div>"; 
       echo "<div class='popup_msg'>"; 
       echo $client['Email']['body']; 
       echo "</div>"; 

} 

code javascript ci-dessous

jQuery(document).ready(function(){ 

jQuery('.t').click(function(e) 
{ 
    var height = jQuery('.popup_msg').height(); 
    var width = jQuery('.popup_msg').width(); 
    leftVal=e.pageX-(width/1.5)+"px"; 
    topVal=e.pageY-(height/13)+"px"; 

    jQuery('.popup_msg').css({left:leftVal,top:topVal}).show(); 
}); 

jQuery('.popup_msg').click(function(e) 
{ 
jQuery('.popup_msg').fadeOut('fast'); 
}); 


}); 

dans les codes ci-dessus, ce que je veux réaliser est, à chaque fois que l'utilisateur clique sur le div avec la classe t, la $ client ['Email'] ['body'] devrait apparaître dans le popup

Answer 1

Le problème est que votre sélecteur correspond à tous les .popup_msg, pas seulement celui dont vous avez besoin. ('' T). Utilisez le find() méthode pour obtenir la fenêtre correcte dans la fonction $ cliquez sur:

jQuery('.t').click(function(e) 
{ 
     var popup_msg = jQuery(this).find('.popup_msg'); 
     var height = popup_msg.height(); 
     var width = popup_msg.width(); 

     leftVal=e.pageX-(width/1.5)+"px"; 
     topVal=e.pageY-(height/13)+"px"; 

     popup_msg.css({left:leftVal,top:topVal}).show(); 
}); 

Note: Je n'ai pas testé ce code, il pourrait ne pas être 100% correct, mais je l'espère vous obtenez ce que je veux dire.