2011-11-06 3 views
2

페이지에 여러 개의 이미지가 있으며 모두 목록에 있습니다. 그 이미지 중 하나를 가져 가면 title 속성을 가져 와서 div에 표시하고 싶습니다. 요소 제목 가져 오기 및 표시

<ul> 
    <li><img src="1.jpg" title="First Image"></li> 
    <li><img src="2.jpg" title="A second Image"></li> 
    <li><img src="3.jpg" title="And another one"></li> 
</ul> 

<div id="imagetitle"> 
<!-- Title Should go Here --> 
</div> 

난 당신이 jQuery를에 attr();이 할 수 있다는 일반적인 생각을 가지고,하지만 난 —이 사람이 나를 도울 수있는 방법을 잘 모르겠어요 : 여기 내 코드는 지금까지입니까?

답변

5

바인드 hover 이벤트. 그런 다음 .text()을 사용하여 #imagetitle div의 콘텐츠를 수정하십시오. this.title또는 원하는 경우 $(this).attr('title')을 통해 제목을 검색 할 수 있습니다.

$('img').hover(function(){ 
    $('#imagetitle').text(this.title); 
}) 
1

시도

$('li').live('hover',function() { 
    $title = $(this).find('img').attr('title'); 
    //alert($title); 
    $('#imagetitle').html($title); 
}); 

DEMO