1

我正在寫一個帶縮略圖的圖庫的jQuery函數。網頁頂部有一個div,可顯示單擊縮略圖的較大版本以及標題和說明。如何使用一個jQuery函數更改兩個單獨元素中的文本?

單擊縮略圖時,標題會根據我的預期發生變化,但描述仍然是默認值(由HTML定義)。

縮略圖是一個無序列表,像這樣:

<ul class=thumblist id=thumblist> 
<li><a title="thumb1" description="this is the first pic"></a></li> 
<li><a title="thumb2" description="this is the second pic"></a></li> 
</ul> 

這裏是jQuery的功能:

$('.thumblist a').click(function() { 
    $("#title").text(this.title); 
    $("#description").text(this.description);   
    }); 

我能做些什麼來解決我的標記,實現我需要的功能, ?

+0

請顯示顯示較大圖像的代碼。 –

回答

6

你想要的attr function

$('.thumblist a').click(function() { 
    var $this = $(this); 
    $("#title").text($this.attr("title")); // Or `this.title`, see below 
    $("#description").text($this.attr("description"));   
}); 

的原因,排序的一半工作是title是對DOM元素實例reflected property有效的HTML屬性,所以this.title給你的屬性;但description不是,所以沒有反映description財產。使用attr即可查找實際屬性值。

理想情況下,使用data-* attributes作爲臨時屬性(如description),未由任何標準定義。

相關問題