使用JQuery的JQuery Cycle和JSON
我找到了jQuery Cycle插件非常有趣。
因此，有以下脚本应该返回图像：
$(function() { // retrieve list of slides from server $.getJSON('slidelist.php', startSlideshow); function startSlideshow(slides) { /* server returns an array of slides which looks like this: [ 'images/beach2.jpg', 'images/beach3.jpg', 'images/beach4.jpg', 'images/beach5.jpg', 'images/beach6.jpg', 'images/beach7.jpg', 'images/beach8.jpg' ] */ var totalSlideCount = 1 + slides.length; var $slideshow = $('#slideshow'); // markup contains only a single slide; before starting the slideshow we // append one slide and prepend one slide (to account for prev/next behavior) $slideshow.prepend('+')
'); $slideshow.append('+')
'); // start slideshow $('#slideshow').cycle({ fx: 'scrollHorz', startingSlide: 1, // start on the slide that was in the markup timeout: 0, speed: 500, prev: '#prev', next: '#next', before: onBefore }); function onBefore(curr, next, opts, fwd) { // on Before arguments: // curr == DOM element for the slide that is currently being displayed // next == DOM element for the slide that is about to be displayed // opts == slideshow options // fwd == true if cycling forward, false if cycling backward // on the first pass, addSlide is undefined (plugin hasn't yet created the fn yet) if (!opts.addSlide) return; // have we added all our slides? if (opts.slideCount == totalSlideCount) return; // shift or pop from our slide array var nextSlideSrc = fwd ? slides.shift() : slides.pop(); // add our next slide opts.addSlide('
', fwd == false); }; }; }）;
但是，因为我在ajax中非常糟糕，你能告诉我如何使用它
$.getJSON('slidelist.php', startSlideshow);
返回图像我怎样才能收到这些图片url？
非常感谢，问候。
嗯..不是关于AJAX 🙂
问题是你在函数startSlideshow收到一个对象：
slides = [ 'images/beach2.jpg', 'images/beach3.jpg', 'images/beach4.jpg', 'images/beach5.jpg', 'images/beach6.jpg', 'images/beach7.jpg', 'images/beach8.jpg' ];
现在，您可以使用基本的for循环迭代此对象：
for(var i=0, len = slides.length; i
现在，每一步都有一个图像url： slides[i] 。 您可以附加到$('#slideshow')并开始玩游戏。