Just starting learning about ajax requests using jQuery. I've tried looking at other posts on this but not sure how to implement it. Here's the code I have. Right now it's just getting the first 3 items. I want it to get 3 random items from the rss feed it's pulling. Here's what I have:
jQuery(document).ready(function($) {
$.ajax({
url: "http://thrive.local/wp-content/themes/thriveafrica/fetcher.php",
type: "GET",
success: function(d) {
$('item', d).slice(0, 3).each(function() {
var $item = $(this);
var title = $item.find('title').text();
var link = $item.find('link').text();
var description = $item.find('description').text();
var image = $(description).find('img').attr('src');
var price = $(descri开发者_C百科ption).find('span.SalePrice').text();
if (price == '') {price = 'Visit Store for Price'};
var html = '<li><a href="'+link+'" target="_blank">';
html += '<div class="image"><img src="'+image+'"></div>';
html += '<div class="info"><strong>'+title+'</strong><br/>'+price+'</div>';
html += '</a></li>';
// Example Output
// <li>
// <div class="image"><img src="http://www.thriveafricastore.com/product_images/s/041/coffee__59525_thumb.jpg"></div>
// <div class="info"><strong>Thrive Africa Blend (1lb)</strong><br>See Price</div>
// </li>
$('div#store ul').append($(html));
}); //End Each
} //End Success
}); // End Ajax Request
});
What are my options?
Thanks!
I'd use something like filter(), rather than slice(), after generating 3 unique numbers in your range:
var rnd1, rnd2, rnd3, undef,
items = $('item', d);
// Generate our random numbers:
rnd1 = Math.floor(Math.random()*items.length);
while (rnd2 == undef || rnd2 == rnd1)
rnd2 = Math.floor(Math.random()*items.length);
while (rnd3 == undef || rnd3 == rnd1 || rnd3 == rnd2)
rnd3 = Math.floor(Math.random()*items.length);
//filter our items, only the ones whose index matches one of our randoms:
items.filter(function (index) {
return index == rnd1 || index == rnd2 || index == rnd3;
}).each(function {
// rest of code...
});
Be warned that this would stick in an infinite loop if the number of items returned is less than 3, because it generates 3 unique numbers within the range 0 - items length. You could take away the while loops and just generate 3 non-unique randoms if this was a possibility.
Here's an example that removes 3 divs at random using this code: http://jsfiddle.net/dAjAt/. Keep clicking the Run button to see it in action.
you could use the shuffle-plugin to shuffle your array. the code would be something like:
var myresults = $('item', d).shuffle();
myresults.slice(0, 3).each(function() {
// ...
}
If you only want 3 items, your server should only return 3 items.
Non-the-less, if you want to achieve this with JavaScript:
jQuery.fn.random = function (amount) {
var els = this.get();
var ret = [];
while (els.length && ret.length < amount) {
ret.push(els.splice(Math.floor(Math.random() * els.length), 1)[0]);
}
return $(ret);
}
Then instead of using $('item', d).slice(0, 3).each
, simply use $('item', d).random(3).each
精彩评论