Блог

Я пытаюсь обернуть динамически загружаемое изображение тегом link:

         var img = new Image();
        slideData[slide].imgData = img; 
        $(img).load(function () {
            $(this).css('display','none');
            $(this).wrap("<a></a>");
            slidesLoaded  ;
        }).attr({src:mediaURL slideData[slide].image, alt:slideData[slide].title});
  

Похоже, это не работает? Когда я делаю это:

 $(slideData[0].imgData).appendTo('body').fadeIn()
  

Здесь нет тегов a, только изображение.

Возможно ли это?

Это потому, что вы сохранили <img> элемент в slideData[slide].imgData , а не элемент-оболочку <a> . Попробуйте:

 $(slideData[0].imgData.parentNode).appendTo('body').fadeIn();
  

Когда вы переносите элемент, это не меняет элементы, имеющиеся в вашем наборе jQuery.

Кроме того, когда вы вставляете элемент где-нибудь в документе (используя .append , .prepend и т.д.), Это удаляет элемент из его текущей позиции и помещает его туда, где вы сказали.

Итак, что происходит, так это то, что вы помещаете свое изображение в <a> тег, а затем немедленно удаляете его снова, чтобы поместить в тело. <a> Тег никогда не добавляется к телу. Очевидно, что решение заключается в добавлении <a> вместо изображения.

 $(img).load(function () {
    $("<a></a>")
        .append($(this).hide())
        .appendTo(document.body);
});