0
我用我的項目砌體與無限滾動。我的內容是通過php動態生成的。我有div內的圖像,當他們(div的)被點擊時做一些事情。 這裏是我的jQuery代碼:砌體與無限滾動 - jQuery代碼不工作後的第1頁
$(document).ready(function(){
function vote(direction, media_id) {
$.get("http://"+ siteDomain +"https://stackoverflow.com/a/vote?type=image&mediaId="+ media_id +"&vote=" + direction, {}, function(data, textStatus) {
if(direction == 'up'){
var current_vote = $("#upmedia-"+ media_id +" div").text();
$("#ico-likes-"+ media_id +" div").css({opacity: 0}).animate({opacity: 1}, 700).text(parseInt(current_vote)+1);
$("#upmedia-"+ media_id +" div").css({opacity: 0}).animate({opacity: 1}, 700).text(parseInt(current_vote)+1);
$("#upmedia-"+ media_id +"").removeClass("voteup").addClass("hasvotedup");
}
}, "json");
}
$(".voteup").click(function() {
var media_id = $(this).attr("id").replace('upmedia-', '');
vote('up', media_id);
return false;
});
});
上面的代碼在單擊div .voteup時執行。所有工作都很好,但僅適用於第一頁。當我通過無限滾動加載第二頁,並用.voteup類單擊某個div時,什麼都不會發生。我的jQuery代碼不適用於從第二頁加載的所有元素。
這裏是我的磚石和無限滾動代碼:
$(function(){
var $container = $(".gwrap-splash");
$container.imagesLoaded(function(){
$container.masonry({
itemSelector : ".gimg-splash",
isAnimated: false,
cornerStampSelector: ".side-block-splash"
});
});
$container.infinitescroll({
navSelector : ".public-navigation",
nextSelector : ".public-navigation-next",
itemSelector : ".gimg-splash",
bufferPx : 20,
loading: {
finishedMsg: "No more pages to load.",
img: "'.STATIC_URL.'/i/default/loader-big.gif"
}
},
function(newElements) {
var $newElems = $(newElements).css({ opacity: 0 });
$newElems.imagesLoaded(function(){
$newElems.animate({ opacity: 1 });
$container.masonry(\'appended\', $newElems, true);
});
});
});
請幫忙!