jQuery的bxslider整合AJAXjQuery、bxslider、AJAX

2023-09-10 18:15:13 作者:小站丶独徘徊

我有这个bxslider code。

I have this bxslider code.

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

和IHAVE这阿贾克斯code:

and ihave this ajax code:

$(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
});
});
});

我想将这一阿贾克斯bxslider。

I want to integrate this ajax to bxslider.

我该怎么办呢?

推荐答案

要使用与阿贾克斯的具体取决于您的数据来自于你的服务器返回。如果它回来了,并已经格式化在服务器端,那么你应该能够只是做:

To use this with ajax is depending on how your data comes back from your server. If it's coming back and has already been formatted on the server side, then you should be able to just do:

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

如果它没有格式化的服务器端,那么你只需要在你的JavaScript格式化,然后应用bxSlider()给它。我觉得也许我不是很让你的问题吗?

If it's not formatted server side, then you just have to format it in your javascript and then apply bxSlider() to it. I feel like maybe I'm not quite getting your question?

如果您仍然有问题随时澄清一点,如果你挣扎它的AJAX部分,或应用bxslider多。

If you're still having problems feel free to clarify a little more if you're struggling with the ajax portion of it, or applying the bxslider more.