2010-08-03 3 views
1

나는 이걸 사용하여 새 창에서 나가는 링크를 엽니 다. 그러나 대상이 일 때 이미지 alt를 제목으로 표시하고 싶습니다.jQuery : 기본 이미지에서 ahref 제목

$("a[href*='http://']:not([href*='"+location.hostname+"']), 
    [href*='https://']:not([href*='"+location.hostname+"'])") 
      .addClass("external") 
      .attr("target","_blank") 
      .attr("title", "Open link in new window"); 
     }); 

.attr ("title")에 이것을 추가하는 가장 쉬운 방법은 무엇입니까?

+0

''태그 사이에 ''이 있다는 것을 의미합니까? –

+0

예, 다음과 같이 : foo PHearst

답변

1

<img>이 앵커 안에있는 경우 다음과 같이 할 수 있습니다.

$("a[href*='http://'], a[href*='https://']").not("[href*='"+location.hostname+"']").each(function() { 
    var $this = $(this).addClass("external").attr("target","_blank"); 
    var img = $this.children('img[alt]'); 
    $this.attr("title", img.length ? img[0].alt : "Open link in new window"); 
}); 

몇 가지 변경 여기있다가, 현재의 선택은 처음 http:// 체크 만 <a>에 보이지만, 다음 https:// 검사에서 모든 요소에 보이는, 그래서 이것은 훨씬 더 효율적입니다. 현재 요소가 내부에 <img>이 있는지 확인합니다. 적용되는 경우 alt 특성을 사용합니다. 그렇지 않으면 기본 제목을 사용합니다.

또는 다른 방법은, 당신이이 같은 이미지가 포함 된 앵커의 제목을 (비록 효율적으로 선택기 변경) 및 이후에 설정된대로 사용 : 당신처럼 들리는에서

$("a.external > img[alt]").each(function() { 
    $(this).parent().attr("title", this.alt); 
}); 
0

외부 창에 표시 할 이미지에 연결하고 있습니다. 이미지를 앵커 태그의 대상으로 사용하면 img 요소가 아닌 실제 이미지 파일을 참조하므로 해당 이미지와 연결된 alt 태그가 없습니다. 반면에, 이미지가 앵커에 포함되어 있고 그것을 클릭하여 새 창을 열면 @ Nick의 솔루션이 트릭을 수행해야합니다. .