2013-10-23 2 views
0

img-wrapper div 앞에 이미지를 붙이고 포스트 제목 앵커의 href으로 묶으려고합니다. 어쩌면 혼란 스러울 수 있습니다. Heres는 코드 :. .post-title a으로도 모든 것이 작동되지만 앵커 사업부는 .img-wrapper 내부 (2 곳에서 올바른 위치에 추가되고 있으며,2 개의 이미지가 왜 앞에 붙어 있습니까?

 $(".post").each(function() { 
    if($(this).find(".post-excerpt > p:first-child").has("img").length){ 

     if($(this).find(".post-title").has("a").length){ 

      $(this).find(".img-wrapper").prepend("<a href='"+$(this).find(".post-title a").attr("href")+"'></a>"); 

      $(this).find(".post-excerpt > p:first-child").has("img").find("img").prependTo($(this).find(".img-wrapper a")); 

     }else{ 

      $(this).find(".post-excerpt > p:first-child").has("img").find("img").prependTo($(this).find(".img-wrapper")); 
     } 
    } 
}); 

나는 그것의가에 추가되는 이유를 이해할 수 없다 . post-title a가 여기에 결과 HTML이다. 나는 단지 img-wrapper DIV에 이미지를 앞에 추가하는 것을 시도하고, 다시

<article class="post"> 

    <div class="img-wrapper"><a href="/test-image-post/#top"><img alt="" src="/content/images/2013/Oct/img.jpg"></a> 

     <header class="post-header"> 

      <h2 class="post-title"><a href="/test-image-post/#top"><img alt="" src="/content/images/2013/Oct/img.jpg">Post Title</a></h2> 

     </header> 

     <section class="post-excerpt"> 

     </section> 

    </div> 

</article> 

감사

답변

1

내가 내 로컬 시스템에 코드를 복제 시도했다. 제대로 앞에 추가 있지만, http://jsfiddle.net/BvGXs/

이미지 경로로 인해로드되지 않습니다 여기

".img-wrapper a", instead you have to use it as ".img-wrapper > a:first-child" after prepending anchor. 

바이올린 : 이미지 때문에 두번 오는 것을 발견했다.

+0

감사합니다. 그건 의미가 있습니다. –

관련 문제