jQuery在span標簽中顯示圖像標題

Question

我有一個無序列表顯示-每個li標簽包含一個圖像，其下帶有一個空的span標簽。 我希望圖像的title屬性顯示在span標簽中。 我在下面使用它，並且可以正常工作，但是它在第一個span標記中顯示了所有圖像的標題...我需要以某種方式確保圖像的標題進入其自己的span標記。 我想我需要一種為每個li或每個li img擁有唯一ID的方法...

$(document).ready(function() {
    $('#pressThumbs li img').fadeIn(function() {
        var $this = $(this);
        $("#description").append($(this).attr('title'));
    });
});

謝謝

搶

Answer 1

ID必須是唯一的。 因此，您在頁面上只能有一個 description ID。

改為將ID description更改為類，並執行以下操作：

試試看： http : //jsfiddle.net/gsFnW/

$(document).ready(function() {
    $('#pressThumbs li img').fadeIn(function() {
        var $this = $(this);
        $this.next('.description').append($this.attr('title'));
    });
});

• http://api.jquery.com/next/

請注意，這假定<img>和<span>彼此相鄰。 我不能肯定地說不看你的標記。 如果介於兩者之間，則執行此操作。

$(document).ready(function() {
    $('#pressThumbs li img').fadeIn(function() {
        var $this = $(this);
        $this.siblings('.description').append($this.attr('title'));
    });
});

• http://api.jquery.com/siblings/

Answer 2

假設這個標記

<ul>
   <li><img src="bla" title="sometitle" /><span class="description" /></li>
   <li><img src="bla" title="sometitle" /><span class="description" /></li>
</ul>

這應該工作。

$(document).ready(function() 
 { 
     $('#pressThumbs li img').fadeIn(function() 
     { 
          var $this = $(this); 
          $this.siblings(".description").html($this.attr('title')); 
     }); 
 });

您的問題是您使用的ID屬性#decription僅可出現在單個dom項目上。 而是使用可以出現的類和許多類。

希望這可以幫助。