레일 루프가있는 중첩 jQuery 루프

Question

레일 루프 내에서 jQuery 루프를 중첩하려하지만 행운이 없습니다.

<% entry.videos.each do |video| %> 
    <input type="hidden" class="url" value="<%= video.url %>"> 
    <div class="videos" src=""></div> 
<% end %> 

와 jQuery를 : jYoutube 단지 YouTube 동영상에서 썸네일을 잡아하는 방법입니다

$('.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"><img src="'+urlThumb+'" class="overlay"/></a></div>')); 
      }); 

여기에는 레일입니다.

문제는 해당 항목에 미리보기 이미지를 삽입하는 대신 비디오가있는 모든 항목에 모든 미리보기 이미지를 삽입한다는 것입니다.

Answer 1

형제 기능을 사용하여 동영상 클래스가있는 해당 div를 필터링 할 수 있습니다.

예 :

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

Answer 2

, 나는 그러나 2 개 이상의 URL을 가지고 각 항목에 대해, 그것은 더 이상 각 항목에 thumbails을 모두 결합되지

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