jquery - 如果父母有兩個或更多的孩子創建ul其他不要創建ul

Question

我想要定製一個插件，呈現與以下功能的Tumblr文章的圖像。

到目前爲止，我只設法將類.photoset添加到照片文章的ul中，如果有2個或更多圖像。

function getImages(post) { 
    //  console.log(post) 
    var html = []; 
    html.push("<ul class='tumblr_post_images'>") 
    $.each(post.photos, function (i, photo) { 
     html.push('<li class="photo"><img src=' + photo.alt_sizes[0].url + '></li>')    
    }) 

    $('.post_photo ul').has('li:nth-child(n+2)').addClass("photoset"); 

    html.push("</ul>") 

    return html.join("");    
}; 

理想情況下，我希望只有在帖子中存在超過2張圖片的情況下才會呈現ul，這樣標記才幹淨。我已經嘗試了一些條件聲明，但我無法得到這個工作。任何幫助都感激不盡。

UPDATE 感謝T.J.克羅德斯的答案我設法找到解決我的問題。下面是工作代碼：

//Function to retrieve all the images from the post. This builds an array which is then returned as html list of images. 
     function getImages(post) { 
var html = []; 

// Get the HTML 
if (post.photos.length === 1) { 
    $.each(post.photos, function (i, photo) { 
       html.push('<img src=' + photo.alt_sizes[0].url + '>') 
        })} 
       else { 
     // More than one 
     html.push("<ul class='photoset'>") 
     $.each(post.photos, function (i, photo) { 
      html.push('<li class="photo"><img src=' + photo.alt_sizes[0].url + '></li>')    
     }); 
     html.push("</ul>"); 
    } 
      return html.join(""); 
     } 

更新2 有一個錯誤在T.J. Crowders的原始答案。他修好了，現在他的答案奏效了！ 謝謝！

Answer 1

基本上我想創建一個UL僅在有2個或更多在照片中的圖像

然後只需檢查post.photos.length：

function getImages(post) { 
    var html = []; 

    // Get the HTML 
    if (post.photos.length) { 
     // We have at least one image 
     if (post.photos.length === 1) { 
      // Just one image 
      html.push('<img src=' + post.photos[0].alt_sizes[0].url + '>'); 
     } 
     else { 
      // More than one 
      html.push("<ul class='tumblr_post_images'>") 
      $.each(post.photos, function (i, photo) { 
       html.push('<li class="photo"><img src=' + photo.alt_sizes[0].url + '></li>')    
      }); 
      html.push("</ul>"); 
     } 
    } 

    // Add or remove the class depending on whether we have more than one  
    $('.post_photo ul').toggleClass("photoset", post.photos.length > 1); 

    // Return the HTML (why are we returning it rather than putting it in the element here?) 
    return html.join("");    
} 

另外請注意，我在缺少分號添加（強烈建議您不要依靠那就是自動分號插入的恐怖），除去不必要的一個（函數聲明的聲明，不表達;在它們的最後沒有;）。

Answer 2

嘗試使用此代碼替換$('.post_photo ul').has('li:nth-child(n+2)').addClass("photoset");：

if (post.length == 2) { 
    $('.post_photo ul').addClass("photoset") 
} 

Answer 3

試試這個$(id).children().length去領受謝子元素的個數