Nested jQuery loop with Rails loop
I'm trying to nest a jQuery loop within a Rails loop but am not having any luck. The here is the rails:
<% entry.videos.each do |video| %>
<input type="hidden" class="url" value="<%= video.url %>">
<div class="videos" src=""></div>
<% end %>
and the jQuery:
$('.url').each(function () {
var urlThumb = $.jYoutube($(this).val(), 'small');
var url = $(this).val();
$('.videos').append($('<div class="vidya"><a href="'+url+'" rel="prettyPhoto" class="youtubeLink"&g开发者_如何学编程t;<img src="'+urlThumb+'" class="overlay"/></a></div>'));
});
where jYoutube is just a method to grab a thumbnail from a youtube video.
The issue is that rather that inserting the thumbnail into the respective entry, it inserts all thumbnails into all entries with a video.
You can use siblings function to filter the corrsponding div with videos class.
e.g:
$('.url').each(function(){
var urlThumb = $.jYoutube($(this).val(), 'small');
var url = $(this).val();
$(this).siblings('.videos').append
(
$('<div class="vidya"><a href="'+url+'" rel="prettyPhoto" class="youtubeLink"><img src="'+urlThumb+'" class="overlay"/></a></div>')
);
});
Try this I am not sure
$('.url').each(function (index) {
var urlThumb = $.jYoutube($(this).val(), 'small');
var url = $(this).val();
$('.videos').append($('<div class="vidya"><a href="'+url+'" rel="prettyPhoto" class="youtubeLink"><img src="'+urlThumb+'" class="overlay"/></a></div>'));
});
精彩评论