Javascript .attr（'；title'；）有问题

我试图检索title属性并用它替换当前段落文本。我剧本的其他方面都很好。标题属性返回为“未定义”。我是javascript新手，我已经到处寻找答案。。。到目前为止我什么也没看到

JS:

$(document).ready(function(){

    $('.thumbnails a').click(function(e){
        e.preventDefault();

        $('.thumbnails a').removeClass('selected');
        $('.thumbnails a').children().css('opacity','1');

        $(this).addClass('selected');
        $(this).children().css('opacity','.4');

        var photo_caption = $(this).attr('title');
        var photo_fullsize = $(this).attr('href');
        var photo_preview = photo_fullsize.replace('_large','_preview');

        $('.preview').html('<a href="'+photo_fullsize+'" title="'+photo_caption+'" style=background-image:url('+photo_preview+')></a>');

        $('.caption').html('<p><a href="'+photo_fullsize+'" title="'+photo_caption+'">View larger</a></p><p>'+photo_caption+'</p>');
    });
});

<li>
   <a href="images/webdesign/indiePantry_large.jpg" target="_blank">
      <img src="images/webdesign/indiePantry_thumbnail.jpg" 
             width="160" height="160" title="Indie Pantry" />
   </a>
</li>

$（文档）.ready（函数（）{
$（'.thumbnails a'）。单击（函数（e）{
e、 预防默认值（）；
$（'.thumbnails a'）.removeClass（'selected'）；
$（'.thumbnails a'）.children（）.css（'opacity'，'1'）；
$（this.addClass（'selected'）；
$（this.children（）.css（'opacity'，'.4'）；
var photo_caption=$（this.attr（'title'）；
var photo_fullsize=$（this.attr（'href'）；
var photo_preview=photo_fullsize。替换（“大”、“预览”）；
$（'.preview'）.html（''）；
$（'.caption'）.html（'
'+photo_caption+'
'）；
});
});

HTML:

$(document).ready(function(){

    $('.thumbnails a').click(function(e){
        e.preventDefault();

        $('.thumbnails a').removeClass('selected');
        $('.thumbnails a').children().css('opacity','1');

        $(this).addClass('selected');
        $(this).children().css('opacity','.4');

        var photo_caption = $(this).attr('title');
        var photo_fullsize = $(this).attr('href');
        var photo_preview = photo_fullsize.replace('_large','_preview');

        $('.preview').html('<a href="'+photo_fullsize+'" title="'+photo_caption+'" style=background-image:url('+photo_preview+')></a>');

        $('.caption').html('<p><a href="'+photo_fullsize+'" title="'+photo_caption+'">View larger</a></p><p>'+photo_caption+'</p>');
    });
});

<li>
   <a href="images/webdesign/indiePantry_large.jpg" target="_blank">
      <img src="images/webdesign/indiePantry_thumbnail.jpg" 
             width="160" height="160" title="Indie Pantry" />
   </a>
</li>

标题在图像上，而不是

元素：

var photo_caption = $('img', this).prop('title');

---

在代码中，

此

引用的是

a

标记，而不是图像

尝试：

---

您使用的是

this

，但在您的代码中，

this

指的是没有title属性的

。您需要使用

$（this.find（'img'）.attr（'title'）

这是您的
a
标签，
a
没有
标题（img有）

通过chrome和f12开发者面板进行尝试。您可以在javascript代码中设置断点，并随时检查此
的确切内容。
您可以为html添加标记，以便我们确保元素具有title属性吗？具有类
缩略图的元素在哪里？@j08691可能这是
。