jQuery Нет размеров изображения после добавления - PullRequest
Новая
       9

jQuery Нет размеров изображения после добавления

0 голосов
/ 21 октября 2011

У меня есть следующий код, который зацикливается, чтобы получить все изображения в таблице, затем добавляет их к #featured, который затем добавляется к #wrapper.Проблема в том, что после того, как все добавлено к #wrapper, изображения не имеют размеров и по этой причине они не отображаются.Это как ширина и высота 0px для изображений.Как мне преодолеть этот размер проблемы.

var featured = '<div id="featured"></div>';
$('#imageTable tbody tr td img').each(function(){
    $(featured).append('<img src='+$(this).attr("src")+' />');
});
$(featured).appendTo('#wrapper');

Я попытался решить эту проблему, выполнив 

$(featured).load(function(){
    $(this).appendTo('#wrapper');
});

Но это не сработало.

1 Ответ

2 голосов
/ 21 октября 2011

Ваша проблема в том, что каждый раз, когда вы говорите $(featured), вы создаете совершенно новый объект jQuery; затем вы что-то делаете для этого и бросаете - & mdash; и что вы с ним сделали & mdash; далеко. В результате вы добавляете пустое значение <div id="featured"> к #wrapper: изображения не имеют размеров, их просто нет.

Создайте один объект jQuery и продолжайте использовать этот один объект: 

var $featured = $('<div id="featured"></div>');
$('#imageTable tbody tr td img').each(function(){
    $featured.append('<img src='+$(this).attr("src")+' />');
});
$featured.appendTo('#wrapper');

Демо: http://jsfiddle.net/ambiguous/PXVG2/

Повторное выполнение $(x).append(...) будет работать при условии, что x уже есть в DOM; ваш <div id="featured"> не такая вещь. Если вы сначала добавили его к #wrapper, а #wrapper был в DOM, то все было бы нормально, если бы вы использовали #featured вместо HTML: 

var featured = '<div id="featured"></div>';
$(featured).appendTo('#wrapper');
$('#imageTable tbody tr td img').each(function(){
    $('#featured').append('<img src='+$(this).attr("src")+' />');
});

Демо: http://jsfiddle.net/ambiguous/vPyy6/

Этот последний подход довольно расточителен, он создает новый объект jQuery на каждой итерации .each. Первый подход намного лучше.

...