2013-02-22 3 views
0

다음과 같은 문제가 있습니다. 나는 많은 양의 콘텐츠를 손으로 움직 였고 이미지를 삽입하는 동안 라이트 박스 클래스를 태그에 붙였다. 불행히도 이미지가 올바르게 작동하려면 전체 이미지 크기에 대한 URL을 지정하는 앵커가 필요하다. 예를모든 사진 주위에 링크 추가

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

을 위해 내가 지금 가지고 모든입니다

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

자동으로 특정 <div> 요소 내부에서 발견 된 모든 이미지 주위에 anchar을 설정할 수도 제대로 닫습니다? 나는 <div> 앞에 추가 <a href="this.image.src">

foreach는 이미지 같은 것을 필요로하고 </a>

PHP jQuery와의 모든 솔루션은 크게 감사하겠습니다을 추가 할 것입니다!

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

DEMO :

+0

http://api.jquery.com/wrap/ – sachleen

+0

HTML5를 사용하면 필요하지 않지만 이미지 태그 '' – Sablefoste

답변

4

당신은 jQuery의 .wrap() 방법을 사용할 수 있습니다 jQuery로 http://jsfiddle.net/bztvw/

+0

을 직접 닫아 야합니다. – Jai

+0

@Jai : 클래스를 추가했습니다. –

+0

이제 더 좋습니다. – Jai

1

사용 .wrap() :

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

당신이 이러한 이미지의 컨테이너 사업부를 지정하는 경우, 그것은 더 나은 것 해당 이미지 만 랩핑됩니다.

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

0

사용 정규식은

패턴 :와

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

교체 gener 근원지. 그냥 IDE에서 정규식 찾기/바꾸기를 사용하고 소스를 수정하십시오. 이 실수를 "수정"하기 위해 일부 자바 스크립트 나 PHP 해킹에 의존하지 마십시오.

0

개인적으로 preg_replace이다의 PHP 함수, ​​내가 코드를 해결하는 것입니다 : 이런 식으로 뭔가 :

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