使用ajax在灯箱中没有打开图像

Question

我正在使用漂亮的照片库。我必须在灯箱中打开缩略图，但是当我点击缩略图时，它会在新窗口而不是灯箱中打开。

使用json

从ajax文件加载图片

var article  = "";
$.each(data, function( index, value ) {
    article +="<article class='entry isotope-item "+value.pcat_slug+"'><a href='images/portfolio/"+value.pcat_slug+"/"+value.pimg_name+"' rel='prettyPhoto[pp_gal]' data-rel='prettyPhoto'><img class='img-responsive' data-original='images/portfolio/"+value.pcat_slug+"/"+value.pimg_name+"' alt='"+value.pcat_name+"' title='"+value.pcat_name+"' src='images/portfolio/"+value.pcat_slug+"/"+value.pimg_name+"' /><span class='magnifier'></span></a></article>";
    //li +="<li class='"+value.cat_slug+"'><img src='images/portfolio/logo/"+value.pcat_slug+"/"+value.pimg_name+"'/></li>";
});

$(".portfolio").empty();
$(".portfolio").append(article);
$(".portfolio").append("<div class='clear'></div>");

从ajax加载后，图像将在此div中显示：

<div class="portfolio"></div>

我使用下面的代码打开弹出窗口：

/*prettyPhoto*/ jQuery(document).ready(function(){
    jQuery('a[data-gal]').each(function() { jQuery(this).attr('rel', jQuery(this).data('gal'));}); jQuery("a[data-rel^='prettyPhoto']").prettyPhoto({animationSpeed:'slow',theme:'light_square',slideshow:false,overlay_gallery: false,social_tools:false,deeplinking:false});
});

Answer 1

您应该使用window.load而不是document.ready。请参阅下面的代码。

<script src="//maps.googleapis.com/maps/api/js?key=<?=$google_api_key?>&sensor=false" type="text/javascript"></script>
<script language="javascript">
var geocoder, location1, location2, radius_verified;
geocoder = new google.maps.Geocoder();
radius_verified = - 1;
var Zone1, Zone1_enabled;
var Zone2, Zone2_enabled;
var Zone3, Zone3_enabled;

window.verifylocation = function() {
	var restaurant_location = '<?= $objRestaurant->rest_address . ", " . $objRestaurant->rest_city . ", " . $objRestaurant->rest_state; ?>';
	var customer_location = $("#customer_address").val() + " , " + $("#customer_city").val() + " , " + $("#customer_state").val();
	
    var radius = '<?= $objRestaurant->delivery_radius ?>';
	
    geocoder.geocode({'address': restaurant_location}, function(results, status) {
		// Here is my Code but before my code run it returns undefined.
    });
};