0

到目前为止我的代码：

$(".lorem img:not(.full-img)").each(function() { 
    $(this).addClass("inline-img");
    var imgWidth = $(this).prop('width');
    var imgHeight = $(this).prop('height');
    var imgFloat = $(this).prop('float');

    $(this).wrap('<div class="inline-img-wrap" />'); 
        if ($(this).prop("title")!='') {
            $('<p class="inline-img-caption">').text($(this).prop('title')).insertAfter($(this)); 
        }
});

我正在文本正文中搜索图像，将它们的值作为标题附加在下面，并将title两者都包装在. 这很好用。imgpdiv.inline-img-wrap

我需要帮助的是将样式应用img到新的包装 div 上。您可以看到我为此创建了 var，但无法将它们应用到工作中。$this将始终应用于图像，并且<div class="inline-img-wrap" style="width:'+imgWidth+'">不起作用。

所有建议表示赞赏！

4

2 回答 2

1

尝试使用data属性和css方法：

<img data-class='something'  src=''/>;


 $(".lorem img:not(.full-img)").each(function() { 
    $(this).addClass("inline-img");
    var imgWidth = $(this).css('width');
    var imgHeight = $(this).css('height');
    var imgFloat = $(this).css('float');

    $(this).wrap('<div class="inline-img-wrap + " " + $(this).data('class') + " />'); 
        if ($(this).prop("title")!='') {
            $('<p class="inline-img-caption">').text($(this).prop('title')).insertAfter($(this)); 
        }

    $("." + $(this).data('class')).css({"width": imgWidth, `height`: imgHeight, `float`: imgFloat})
});
于 2012-06-30T14:47:34.660 回答
0

我说得对吗，您需要检索新创建的包装元素？

var $wrap = $(this).wrap('<div class="inline-img-wrap" />').parent();
if ($(this).prop("title")!='') {
    $('<p class="inline-img-caption">').text($(this).prop('title')).appendTo($wrap); 
}
// do any other manipulations with $wrap

PS 作为旁注：缓存你的 jQuery 对象 - 你不断地调用 $(this) 这是次优的

于 2012-06-30T14:36:08.810 回答