JQuery загружает данные, а не запускает модал, как должно - PullRequest
Новая
       11

JQuery загружает данные, а не запускает модал, как должно

1 голос
/ 06 августа 2009

Хорошо, у меня есть карта страны, пользователь нажимает на их штат, и через jQuery через такую ​​страницу загружается группа поставщиков: 

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

Затем, когда он отображает предложения, я хочу, чтобы пользователь мог щелкнуть «связаться с нами» рядом с каждым дилером и получить модальный прыжок с контактной формой. Но это не похоже на стрельбу. при нажатии просто ничего не делает.

Вот код jQuery для запуска модального окна: 

$(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();
});

});

Следующий код работает вне загруженного содержимого, но не внутри. У кого-нибудь есть идеи? 

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

Заранее спасибо!

1 Ответ

2 голосов
/ 06 августа 2009

с динамически загружаемым содержимым, вам просто нужно использовать живые привязки. Пожалуйста, используйте jQuery live . Предположим, что контактная ссылка имеет класс «clsContact», тогда вы можете поместить диалоговое окно, открывающее логин, в функцию «OpenModal» и связать ссылки следующим образом: 

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