如何在图片标签中包装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标签？

回答

相关问题