Добавить ссылку вокруг каждого изображения

Question

У меня есть следующая проблема. Я перемещаю большое количество контента вручную, и, вставляя изображения, я помещаю класс lightbox в тег - к сожалению, для правильной работы изображений им нужен якорь вокруг них, указав URL-адрес на полный размер изображения - например

<a href="images/myimage.jpg" class="lightbox"><img src="images/myimage.jpg"></a> 

Все, что я получил сейчас:

<img src="images/myimage.jpg" class="lightbox"> 

можно ли автоматически установить Анчар вокруг каждого изображения находится внутри конкретного <div> элемента, а также должным образом закрыть его? Мне нужно что-то вроде

Еогеасп изображения в <div> препендом <a href="this.image.src"> и добавить </a>

Любое решение в РНР или JQuery бы очень признателен!

Answer 1

Вы можете использовать .wrap() метод JQuery в:

$('div img').each(function(){ 
    $(this).wrap('<a href="'+this.src+'" class="lightbox"></a>'); 
}); 

DEMO: http://jsfiddle.net/bztvw/

Answer 2

С JQuery использовать .wrap():

$.each($('img'), function(){ 
    $(this).wrap('<a href="'+$(this).attr('src')+'" class="lightbox"></a>') 
}); 

Было бы лучше, если бы вы указать контейнер DIV этих изображений то только те изображения будут обернуты. Что-то вроде этого:

$.each($('#lighboximgwrapper img'), function(){ 
    $(this).wrap('<a href="'+$(this).attr('src')+'" class="lightbox"></a>') 
}); 

Answer 3

Использование RegExp

Выкройка:

<img(.*)src="([\w\/\.]+)"(.*)> 

Заменить:

<a href="$2" rel="fancybox"><img src="$2" alt="" /></a> 

preg_replace PHP Функция

Answer 4

Лично я хотел бы исправить код Gener на источник. Просто используйте поиск/замену регулярных выражений в вашей среде IDE и исправьте источник. Не полагайтесь на некоторые javascript или PHP-хак, чтобы «исправить» эту ошибку.