Question

我尝试使用innerWrap，

更改为将td值包装到图像中

jQuery( "td[id^='imageList']" ).wrapInner( "<img></img>" );
jQuery( "td[id^='imageList']" ).wrapInner( "<img>" );
jQuery( "td[id^='imageList']" ).wrapInner( "<img src=''>" );

（显然）都失败了。

http://source.to/image.png

成为

<img>http://source.to/image.png</img>

我想要的是

http://source.to/image.png

成为

<img src="http://source.to/image.png">

有人有个好主意解决这个问题吗？

Answer 1

您需要创建图像并更改源。为此，您可以使用：

jQuery( "td[id^='imageList']" ).each(function(){
    $this = jQuery(this);
    var img = jQuery('<img>', {'src' : $this.text()});
    $this.empty().append(img);
})

Answer 2

您可以使用.wrapInner(function)

使用

jQuery("td[id^='imageList']").wrapInner(function() {
  return "<img src='"+ $(this).text() +"'></img>";
});

DEMO

Answer 3

做这样的事情：

jQuery( "td[id^='imageList']" ).each(function(){
    var $this = jQuery(this);
    var src = jQuery.trim($this.text());
    $this.html('<img src="'+ src +'">');
});

修剪字符串很好，因为路径周围也可能有一些空格。

示例：http://codepen.io/KATT/pen/dqJGA

不过，我可能会使用class而不是id。

示例＃2：http://codepen.io/KATT/pen/AjvdK

jQuery使用td值作为img的src

3 个答案: