Открыть Popup После AJAX Нагрузки HTML

Question

У меня есть следующий код, чтобы вызвать и AJAX вызова, а затем попытаться открыть всплывающее окно:

function ajax_post(form_info){ 
    var arr = form_info.split('#'); 
    var id = arr[0]; 
    var action = arr[1]; 
    var request = $.ajax({ 
    url: "../ajax_handler.php", 
    type: "POST", 
    data: {id : id, action: action}, 
}); 

    request.done(function(msg) { 
    $("#result_container").html(msg); 
    }); 

    request.fail(function(jqXHR, textStatus) { 
    alert("Request failed: " + textStatus); 
    }); 
} 

$('.open-popup').on("click", function() { 
    var clicked_id = $(this).attr('id'); 
    ajax_post(clicked_id);  
    $('.overlay-pop').fadeIn('slow'); 
    $('.trading-floor-popup').fadeIn('slow'); 
    }); 
    $('.close, .overlay-pop').click(function() { 
    $('.overlay-pop').fadeOut(); 
    $('.trading-floor-popup').fadeOut(); 
    }); 
    $('.menu').click(function() { 
    $('.nav').slideToggle(); 
}); 

Вот всплывающий код, который генерируется в моей странице:

<div class="overlay-pop"></div><!--overlay close--> 
    <div class="trading-floor-popup"> 
    <a class="close"><img src="images/cross.png" alt=""/></a> 
    <div class="trading-floor-popup-scroll"> 
    <div class="trading-f-l"> 
    <span class="live"> 
     <h6>Contest Goes Live On</h6> 
     <div id="timer"></div> 
     <?php 
      $year = date('Y', $event_start_time); 
      $month = date('n', $event_start_time); 
      $day = date('j', $event_start_time); 
     ?> 

     <p style="text-transform: uppercase;"><?php echo $start_date; ?></p> 
     <p style="text-transform: uppercase;"><?php echo $start_time; ?></p> 
     </span> 
     <ul class="m-top-15"> 
     <li><h1>NFL $300 PLAY-ACTION</h1><span><b>(Balance: </b><i>$7.45)</i></span></li> 
     <li><b>Tickyr $: </b><i>$3</i></li> 
     <li><b>Total Prizes: </b><i>$300,000</i></li> 
     <li><b>Type: </b><i>0</i></li> 
     <li><b>Entries: </b><i>6767/453k</i></li> 
     <li><b>TRPs: </b><i>12</i></li> 
     <li><b>End Time: </b><i>200</i></li> 
     </ul> 
     <div class="join-contest"> 
     <a href="">JOIN CONTEST</a> 
     </div><!--join-contest close--> 
     </div><!--trading-f-l close--> 

     <div class="wrapper"> 
     <div class="enterants"> 
     <!--<h1>Contest Details</h1> 
    <img class="border" src="images/border1.png">--> 
     <div class="enterants-primary"> 
     <h1>Entrants</h1> 
     <div class="search fr"> 
    <input type="text" placeholder="Search Entrant..."><input type="submit" value=""> 
    </div> 
     <ul> 
     <li>YeaUaintready <b>M</b></li> 
     <li>Garcia49ers05 </li> 
     <li>Ljanayb87 <b>M</b></li> 
     <li>Rweeter79 </li> 
     <li>Brogowski </li> 
     <li>Squantos </li> 
     <li>Garcia49ers05 </li> 
     <li>Ljanayb87 <b>M</b></li> 
     <li>Rweeter79 </li> 
     <li>YeaUaintready <b>M</b></li> 
     <li>Garcia49ers05 </li> 
     <li>Ljanayb87 <b>M</b></li> 
     <li>Rweeter79 </li> 
     <li>Brogowski </li> 
     <li>Squantos </li> 
     <li>Garcia49ers05 </li> 
     <li>Ljanayb87 <b>M</b></li> 
     <li>Rweeter79 </li> 
     <li>Rweeter79 </li> 
     </ul> 
     </div><!--enterants-primary close--> 

     <div class="enterants-secondary"> 
     <h1>Prize Payouts</h1> 
     <ul> 
     <li>1st <b>$20,000.00</b></li> 
     <li>2nd <b>$5,000.00</b></li> 
     <li>3rd <b>$20,000.00</b></li> 
     <li>4th <b>$45,000.00</b></li> 
     <li>5th <b>$20,000.00</b></li> 
     <li>6th <b>$2,000.00</b></li> 
     <li>7th <b>$34,000.00</b></li> 
     <li>8th <b>$20,000.00</b></li> 
     <li>9th - 10th <b>$5,000.00</b></li> 
     </ul> 
     </div><!--enterants-secondary close--> 

     </div><!--enterants close--> 
    </div><!--wrapper close--> 
     </div><!--trading-floor-popup-scroll close--> 
    </div><!--trading-floor-popup close--> 

Как я могу отобразить это после того, как AJAX загрузит это на страницу?

Answer 1

Если ваш запрос кода запроектирован, отобразите div.

function ajax_post(form_info){ 
    var arr = form_info.split('#'); 
    var id = arr[0]; 
    var action = arr[1]; 
    var request = $.ajax({ 
    url: "../ajax_handler.php", 
    type: "POST", 
    data: {id : id, action: action}, 
}); 

    request.done(function(msg) { 
    $("#result_container").html(msg); 
    $('.overlay-pop').fadeIn('slow'); 
    $('.trading-floor-popup').fadeIn('slow'); 
    }); 

    request.fail(function(jqXHR, textStatus) { 
    alert("Request failed: " + textStatus); 
    }); 
} 

$('.open-popup').on("click", function() { 
    var clicked_id = $(this).attr('id'); 
    ajax_post(clicked_id);  
    }); 
    $('.close, .overlay-pop').click(function() { 
    $('.overlay-pop').fadeOut(); 
    $('.trading-floor-popup').fadeOut(); 
    }); 
    $('.menu').click(function() { 
    $('.nav').slideToggle(); 
}); 

вариант anoyher это Аякса сделано функ

$.ajax({ 
    url: "test.html", 
    context: document.body 
}).done(function() { 
    $(this).addClass("done"); 
}); 

из этого кодекса: http://api.jquery.com/jquery.ajax/