javascript - Colorbox and Content returned via ajax -
i'm using jquery colorbox popup user accounts in window. have button loads more users page via ajax, reason users loaded ajax not popup in colorbox window. how can colorbox work content returned via ajax?
function loadmore(pageno) { //$("#loading").html('loading...').show(); var url = '/search/resultsajax'; $.get(url, {page: pageno}, function(response) { $("#results").append(response); //$("#loading").hide(); }); } $(document).ready(function() { var currpage = 1; $("a.next").click(function() { loadmore(++currpage); }); $("a.usr").colorbox({width:"960px", height:"90%", iframe:true}); });
when bind colorbox in $(document).ready()
this:
$("a.usr").colorbox({width:"960px", height:"90%", iframe:true});
jquery go search through page, grab matches a.usr
, bind colorbox items, , forget a.usr
. jquery won't remember you're interested in a.usr
new ones won't colorbox'd.
the usual solution sort of thing use .live()
or .delegate()
won't work here there isn't "colorbox" event.
however, can bind colorbox hand enough. try change loadmore
more this:
function loadmore(pageno) { $.get('/search/resultsajax', { page: pageno }, function(response) { var $html = $(response); $html.find('a.usr').colorbox({ width: '960px', height: '90%', iframe: true }); $('#results').append($html); }; }
you turn response
html jquery object, find a.usr
things inside it, bind colorbox those, , insert new html dom usual.
Comments
Post a Comment