如何追加所有相同的類jQuery？

Question

在我的網站上，我想在課程的下面添加一個div，我有很多相同的課程。 該網站正在出售T恤，每件都有.color類。 每次刷新頁面時，它只會追加到一個項目，而當我轉到第二個項目時，div不會追加。 #myshop正在從其他站點加載，所以這就是為什么我需要使用append添加消息的原因。 我之所以使用setTimeout的原因是因為#myshop是在頁面加載之后加載的，所以我不得不延遲它。 您可以在我的網址www.sayhitoworld.com上進行檢查，單擊任何項​​目，您將看到顏色下方的消息，返回並單擊另一個項目，該消息將不再追加。 感謝您的時間。

 jQuery('#myshop').one('click', function(){ setTimeout(append_color, 1000); }); function append_color(){ jQuery('.color').append("<div id='append_color' >Note: If the T-shirt had the same color as the character's hair or body, you won't see the shape, still cool though.</div>"); } 

Answer 1

這些項目在同一頁面上嗎？ 如果是這樣，則該div將僅追加到第一項，因為div具有ID。 ID必須是唯一的，因此每頁只能存在一個稱為append_color的div。 為什么不附加一個名為append_color的類，看看是否對您有用。

function append_color(){
    $('.color').each(function(){
        $(this).append("<div class='append_color' >Note: If the T-shirt had the same color as the character's hair or body, you won't see the shape, still cool though.</div>");
    });
}

Answer 2

嘗試：

$('.color').each(function(i, obj) {
    $(obj).append(<your_template>);
});

Answer 3

嘗試切換到on方法，而不是one方法（如果可能的話），這就是為什么該函數僅觸發一次的原因。 從文檔：

.one（事件[，數據]，處理程序）：
將處理程序附加到元素的事件。 每個事件類型的每個元素最多只能執行一次處理程序。

嘗試這樣的事情：

jQuery(document).on('click', '#myshop', function(){
    setTimeout(append_color, 1000);
});

function append_color(){
    jQuery('.color').append("<div id='append_color' >Note: If the T-shirt had the same color as the character's hair or body, you won't see the shape, still cool though.</div>");  
}