使用jquery在src属性中使用变量

时间:2015-02-17 18:30:53

标签: jquery image attributes src jquery-lazyload

我在网站上使用B-Lazy插件(http://dinbror.dk/blog/blazy/)。我想在窗口宽度方面加载不同的图像:

如果窗口宽度< 420px,该插件接受加载img的&#39; data-src&#39;由数据-src-small&#39;重新加入。

所以,我想获取data-src图像网址并添加到结尾&#39; -228x170&#39;就在&#39; .jpg&#39;之前那样:

<img data-src="img-name.jpg" > 成为 <img data-src-small="img-name-228x170.jpg" >

这里是我的代码: `

$('img').addClass('b-lazy');

$("img.b-lazy").each(function() {       

         $(this).attr("data-src",$(this).attr("src"));
         $(this).attr('src','data:trans.gif');

        var src = $(this).attr('data-src');
        $(this).attr('src', 'src + -228x170.jpg' ); //here my mistake

 });

`

1 个答案:

答案 0 :(得分:0)

在这里,你只需改变引用的位置,并删除初始扩展名:

var src = $(this).attr('data-src').replace('.jpg', '');
$(this).attr('src', src + '-228x170.jpg' );

评论中的每个问题:

var src = $(this).attr('data-src').replace('.jpg', '');
var specialChars = ('fooo'); //this can be set dynamically

$(this).attr('src', src + '-228' + specialChars  + '.jpg' );

HTH, -Ted