使用jQuery加載圖片？

Question

我有一個UL李菜單等類

<ul> 
    <li><a href="#1">Image #1</a></li> 
    <li><a href="#2">Image #2</a></li> 
    <li><a href="#3">Image #3</a></li> 
    <li><a href="#4">Image #4</a></li> 
</ul> 

而且我有喜歡的圖像的容器：

<div id="image-container"> 
    <img src="images/1.jpg"> 
</div> 

我想改用在「圖像容器」的圖像採用div 「散」和「負荷」（每一個圖像是/圖像/文件夾，每一個被命名爲像哈希值，所以負載圖像/ 2.JPG等

我想是這樣的：

$("#ul li:nth-child(1)").click(function(e) { 
     e.preventDefault(); 
     var hash = this.parentNode.hash; 
     $("#image-container").load('images/'+ hash.substring(1) +'.jpg'); 

$("#ul li:nth-child(2)").click(function(e) { 
     e.preventDefault(); 
     var hash = this.parentNode.hash; 
     $("#image-container").load('images/'+ hash.substring(1) +'.jpg'); 

$("#ul li:nth-child(3)").click(function(e) { 
     e.preventDefault(); 
     var hash = this.parentNode.hash; 
     $("#image-container").load('images/'+ hash.substring(1) +'.jpg'); 

(...) 

但它不能很好地工作（我想我需要的東西與負載稍有不同，因爲它不會改變我的圖像？）。

非常感謝。

順便說一句 - 有沒有辦法寫我的jQuery代碼更短（在一個函數中，因爲現在我有多個相同的主體）？

非常感謝， 阿達:)

Answer 1

你可以寫你的代碼有點短這樣的：

$("ul li a").click(function(e) { 
    e.preventDefault(); 
    $("#image-container img").attr('src', 'images/'+ this.hash.substring(1) +'.jpg'); 
}); 

You can try it out here，從原來的幾個變化：

• 附加處理程序爲<a>，它具有散列
• 您可以綁定同樣的處理程序的許多元素，只需要使用所有抓取的元素選擇你想
• 獲取具有this因爲this指<a>元素
• 您<ul>沒有id="ul"屬性，因此選擇應是ul，不#ul
• 不要使用.load()這是獲取內容時，src如果<img>使用.attr()，而不是設置。