2009-08-06 9 views
1

D'accord, j'ai une carte du pays, l'utilisateur clique sur leur état, et un groupe de fournisseurs est chargé par jQuery via une page comme celle-ci:données chargées jQuery pas de tir modal comme il devrait

$('#sa').click(function() { 
    $('#mapimg').hide(); 
    $('<div id="info">&nbsp;</div>').load('dealers.php?state=sa', function() { 
    $(this).hide() 
     .appendTo('#dealers') 
      .slideDown(3000); 
     }); 

Ensuite, quand il affiche les offres, je veux que l'utilisateur puisse cliquer sur le «contactez-nous» à côté de chaque concessionnaire et avoir un modal sauter avec un formulaire de contact en elle. Mais il ne semble pas être en train de tirer. en cliquant ne fait rien.

Voici le code jQuery pour déclencher la boîte modale:

$(document).ready(function() { 

//select all the a tag with name equal to modal 
    $('a').click(function(e) { //I have tried everything here, div, a[name=something], li, etc 
    //Cancel the link behavior 
    e.preventDefault(); 

    //Get the A tag 
    var id = $(this).attr('href'); 

    //Get the screen height and width 
    var maskHeight = $(document).height(); 
    var maskWidth = $(window).width(); 

    //Set heigth and width to mask to fill up the whole screen 
    $('#mask').css({'width':maskWidth,'height':maskHeight}); 

    //transition effect  
    $('#mask').fadeIn(1000);  
    $('#mask').fadeTo("slow",0.8); 

    //Get the window height and width 
    var winH = $(window).height(); 
    var winW = $(window).width(); 

    //Set the popup window to center 
    $(id).css('top', winH/2-$(id).height()/2); 
    $(id).css('left', winW/2-$(id).width()/2); 

    //transition effect 
    $(id).fadeIn(2000); 

}); 

//if close button is clicked 
$('.window .close').click(function (e) { 
    //Cancel the link behavior 
    e.preventDefault(); 

    $('#mask').hide(); 
    $('.window').hide(); 
});  

//if mask is clicked 
$('#mask').click(function() { 
    $(this).hide(); 
    $('.window').hide(); 
}); 

});

Le code suivant fonctionne en dehors du contenu chargé, mais pas à l'intérieur. Quelqu'un a une idée?

<a href='#dialog2' class='openmodal'>Open Modal Box</a> 

Merci d'avance!

Répondre

2

avec le contenu chargé dynamiquement vous avez juste besoin de juste vivre des liaisons. Merci d'utiliser jQuery live events. On suppose que le lien de contact a de la classe « clsContact » alors vous pouvez mettre la connexion d'ouverture de dialogue dans la fonction « OpenModal » et des liens se lient comme ceci:

$("a.clsContact").live('click', OpenModal); 
+0

a très bien fonctionné. Merci! juste une note de côté: ce live n'a pas été mis en œuvre jusqu'à jQuery v1.3 .. cela m'a pris un peu de temps, mais je l'ai trié à la fin =] – Ryan

Questions connexes