jQuery - 環繞圖像尚未被錨點包圍

我在完成一個包含大量內容的網站時遇到了問題。我們在內容中的所有圖像上設置了一個燈箱。意外的是，「燈箱」類已被設置在圖像上，並且沒有在圖像周圍創建鏈接。jQuery - 環繞圖像尚未被錨點包圍

所以我想通過使用jQuerys wrap（）函數在內容區域中的每個圖像周圍添加lightbox-image鏈接。不幸的是，它也包裝已經被錨點包圍的圖像（例如PDF-Links）並覆蓋它們。

我該如何告訴jQuery只在內容中圍繞圖像，而這些圖像還不是錨標籤的一部分？

我有以下現在：

<script type="text/javascript"> 
$(document).ready(function($){ 
$('article img').each(function(){ 
if ($('article img').hasClass('lightbox')){ 
$(this).removeAttr('class'); 
} 
$(this).wrap('<a href="'+this.src.replace("http://www.mydomain.com","")+'" class="lightbox" rel="group1"></a>'); 
}); 
$('.lightbox').lightbox(); 
}); 
</script>

，所以我從圖像消除燈箱類，並用相同的src作爲圖像（沒有縮略圖）添加錨每個圖像周圍。

來源

2013-03-07 Dreshar

爲什麼不只是做'.removeClass（ '收藏夾'）'來刪除一個類，而不是刪除整個屬性？ – 2013-03-07 10:15:59

我之前做過，但是它將類屬性留空，如 – Dreshar 2013-03-07 10:18:02

擁有一個空屬性似乎並不是什麼大不了的事情。只刪除你不想要的類，意味着如果你開始向你想保留的''標籤添加其他類，就不需要改變代碼。 – 2013-03-07 10:21:56

LIVE DEMO

$('article img').each(function(){ 
    if(this.parentNode.tagName != 'A'){ 
     $(this).removeClass('lightbox') 
      .wrap('<a href="'+this.src.replace("http://www.mydomain.com","")+'" class="lightbox" rel="group1"></a>'); 
    } 
});

來源

2013-03-07 10:12:56

謝謝你，完美地完成了這個技巧。真的很感謝你的幫助:) – Dreshar 2013-03-07 10:27:00

改變你的選擇

$('article>img').each(function(){

來源

2013-03-07 10:10:27 strah

我沒有downvote。然而，雖然你所說的是正確的，但絕對沒有證據表明它是*相關的*。你不知道頁面的DOM結構，你不知道'$（'article> img'）'會選擇任何東西。基本上你所做的一切都是毫無根據的 - 而且可能是錯誤的 - 猜測。 – 2013-03-07 10:14:59

確實如此，但可以調整選擇器以反映HTML結構。我相信調整CSS選擇器更有效率和更漂亮。 – strah 2013-03-07 10:17:22

jQuery - 環繞圖像尚未被錨點包圍

回答

相關問題