如何在圖片標籤中包裝html標籤？

我想HTML圖像標記如何在圖片標籤中包裝html標籤？

<img src="img-1.jpg" width="290" height="420" class="frameImage" />

低於轉換爲使用jquery下面的代碼。

<table class="frame" border="0" cellpadding="0" cellspacing="0"> 
    <tr> 
    <td class="border-top" colspan="3"></td> 
    </tr> 
    <tr> 
    <td class="border-left"></td> 
    <td><div class="image-frame"><img src="img-1.jpg" width="290" height="420" class="frameImage" /> 
     <div class="top-left"></div> 
     <div class="top-right"></div> 
     <div class="bottom-right"></div> 
     <div class="bottom-left"></div> 
     </div></td> 
    <td class="border-right"></td> 
    </tr> 
    <tr> 
    <td class="border-bottom" colspan="3"></td> 
    </tr> 
</table>

來源

2009-10-13 pooja

你爲什麼要這麼做？ – 2009-10-13 12:38:12

看起來他想在它周圍放上一個特殊的邊框 – 2009-10-13 12:42:21

這是如此之多的HTML，最好是首先使用它，或者在服務器端生成它。 – DisgruntledGoat 2009-10-13 15:29:58

追加整個表，而不圖像傳遞到文檔。
用class'image-frame'查找div並將圖像放入其中。

來源

2009-10-13 12:38:35 rahul

$('img[src=img-1.jpg]').before('<table class="frame" border="0" cellpadding="0" cellspacing="0"> 
    <tr> 
    <td class="border-top" colspan="3"></td> 
    </tr> 
    <tr> 
    <td class="border-left"></td> 
    <td><div class="image-frame"><img src="img-1.jpg" width="290" height="420" class="frameImage" /> 
     <div class="top-left"></div> 
     <div class="top-right"></div> 
     <div class="bottom-right"></div> 
     <div class="bottom-left"></div> 
     </div></td> 
    <td class="border-right"></td> 
    </tr> 
    <tr> 
    <td class="border-bottom" colspan="3"></td> 
    </tr> 
</table>').remove();

來源

2009-10-13 12:42:12 powtac

如果使用.frameImage作爲選擇器，會更好。 – dotty 2009-10-13 12:54:13

.frameImage選擇這個類的所有元素。 img [src = img-1.jpg]選擇這張圖片的圖片標籤。我認爲代碼只是一個例子。它應該更確切。 – powtac 2009-10-13 12:58:15

你應該能夠做這樣的事情：


    $('.image-frame').html('<img src="img-1.jpg" width="290" height="420" class="frameImage" /%gt;')

，但它會要求你先打印表格，然後將圖像插入表

來源

2009-10-13 12:44:24

這ISN完全沒有答案，但你可能對jQuery-ImageFrame感興趣。

來源

2009-10-13 13:04:23 Jerph

如何在圖片標籤中包裝html標籤？

回答

相關問題