點擊圖像和圖像的名稱顯示在jQuery

Question

我有一個4不同的莫扎特形象，當一個特定的圖像被點擊時，圖片的名稱將顯示在底部。不知道如何開始在jQuery中。

HTML：

<a class="art" href=""><img src="mozart.jpg"></a> 

CSS：

.art { 
    height: 200px; 
    margin-bottom: 20px; 
    width: 200px; 
} 

Answer 1

jsFiddle here.

---

這裏有一個快速的方法來做到這一點::

Ĵ爲例查詢：

$('img').click(function(){ 
    if($(this).next('p').text().length == 0) { 
     $(this).next('p').text($(this).attr('src')); 
    } 
    else { 
     $(this).next('p').text(''); 
    } 
}); 

HTML：

<img src="mozart.jpg"> <p></p> 
<img src="mozart2.jpg"> <p></p> 
<img src="mozart3.jpg"> <p></p> 
<img src="mozart4.jpg"> <p></p>