0

我想使用 jquery 为类 ls-thumb-active 添加一个标题标签,我通过以下方式做到了这一点:

<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
tooltip = "mouseover";

$('.ls-thumb-active').attr('title', tooltip);

$('.displaytitle').html($('.ls-thumb-active').attr('title'));
});//]]>  

</script>

问题是,我希望它显示实际的 img 名称作为工具提示变量,最后没有 .jpg。这可能吗?

4

5 回答 5

3

您可以使用以下内容取出图像名称的“.jpg”部分,这将允许您在获得的名称之后删除任何扩展名:

var imageName = imageElementYouAreGettingSomewhere.src;
imageName = imageName.substr(0, imageName.lastIndexOf('.'));

$('.displaytitle').attr('title', imageName );
于 2013-04-16T15:50:38.133 回答
2

您可以通过“拆分”您的 img 名称轻松地做到这一点。因此,假设 var image 是您的图像名称,如下所示:

var image = 'something_unusual.jpg';

您可以像这样获取图像名称:

var image_name = image.split('.')[0];

然后,当然,您可以像第一次一样添加它:

$('.ls-thumb-active').attr('title', image_name);

请注意,我使用“拆分”方法,该方法将您的图像名称按字符“。”拆分。所以如果图像,由于某种原因,作为“。” 以他的名义,这可能会破裂。您还可以使用最后一个点的索引进行子串、拼接等。但是在那个例子中,如果图像名称中没有点,那么无论文件扩展名是什么,它都会完美地工作。希望这有帮助。

于 2013-04-16T15:48:36.407 回答
1

由于这对每个图像都是必需的,因此您需要遍历所有图像并设置title属性。

$('.ls-thumb-active').each(function() {
    var imgName = $(this).attr('src').split('.')[0];
    $(this).attr('title', imgName );
});
于 2013-04-16T15:51:04.777 回答
0

由于扩展名将是:

  • .jpg
  • .png
  • .gif

您可以使用 substring 在末尾剪切四个字符并添加到标题中。

$('.ls-thumb-active').attr('title', substr(tooltip, 0, strlen(tooltip) - 4));
于 2013-04-16T15:47:21.690 回答
0

使用此代码:

<script type='text/javascript'>
jQuery(document).ready(function($) {
    tooltip = "mouseover";
    thumActive = $('.ls-thumb-active'); // Cached object
    // Get the source name of the image
    thumbImageSrc = $('.target-of-the-image').attr("src");
    // To slice from the last '/' if there is no '/' then slice from the very start
    thumbImageNameFirstSlice = ( thumbImageSrc.lastIndexOf( '/' ) ? thumbImageSrc.lastIndexOf( '/' ) + 1 : 0 );
    // And will slice to the last '.'
    thumbImageName = thumbImageSrc.slice( thumbImageNameFirstSlice, thumbImageSrc.lastIndexOf( '.' ) );
    // Your code =)
    thumActive.attr('title', tooltip);
    // Assign the name to the '.displaytitle'
    $('.displaytitle').html( thumbImageName );
});
</script>

有一个jsFiddle:http: //jsfiddle.net/Np6FG/1/

于 2013-04-16T16:01:06.643 回答