jQuery bxslider集成ajax

Question

我有這個bxslider代碼。

$(function(){
  $('#slider1').bxSlider({
    infiniteLoop: false,
    hideControlOnEnd: true
  });
});

而且我有這個ajax代碼：

$(function () {
$.get('/Scripts/PagedList/PagedList.Mvc.Template.html', function (pagerTemplate) { // get template for pager
// create our pager control object
var pagedList = $.pagedList(
$.template(null, pagerTemplate), // convert into compiled template
function(pageNumber){
return '/home/ajax/#' + pageNumber; // give the pager control the url for loading this page
},
{ pagesToDisplay: 10 } // optional page render options
);

function showNamesAndPagerControl(p) {
$.getJSON("/home/ajaxpage", { page: p ? p : 1 }, function (data) { // default to page 1
$("#namesList")
.attr("start", data.pager.FirstItemOnPage) // update the <li> numbers
.html($("#namesTemplate").tmpl(data.names)); // show the names for this page
$("#namesPager").html(pagedList.render(data.pager)); // update the pager control
}).error(function () {
// if we hit an error (such as a 404), try loading the first page
if (p !== 1) // don't do this if we just tried to load the first page
showNamesAndPagerControl(1);
});
}

// get current url hash (ex: "#3" for page 3)
var hash = window.location.hash;
if (hash)
hash = hash.slice(1); // chop off the leading "#"

// load whatever the currently requested page is
showNamesAndPagerControl(hash);

$(".PagedList-pager a").live("click", function (ev) {
ev.preventDefault(); // don't let the page actually navigate
var pageNumber = $(this).data('page'); // load the pagenumber from the link's data-pager attribute
showNamesAndPagerControl(pageNumber);
window.location.hash = pageNumber; // update the url hash
});
});
});

我想將此ajax集成到bxslider。

我該怎么做？

Answer 1

將此與ajax一起使用取決於您的數據如何從服務器返回。 如果它又回來了並且已經在服務器端進行了格式化，那么您應該能夠做到：

$.getJSON({
    success:function(data){
                $(data).appendTo($('wherever'));
                $(data).find('#yourItem').bxSlider();
            }
}

如果服務器端未格式化，則只需在javascript中對其進行格式化，然后對其應用bxSlider（）。 我覺得我可能還不太了解您的問題？

如果您仍然遇到問題，請在嘗試解決其中的ajax部分或更多應用bxslider時，再進行澄清。