添加高分辨率下载链接到图像

时间:2014-04-06 04:35:08

标签: jquery

我有一系列带有alt标签的图片作为标题,我试图在下载链接后插入ny1.jpg与ny1_hires.jpg

<img src="img/ny1.jpg" alt="Lunar New Year 2012: Year of the Dragon" />
<img src="img/ny2.jpg" alt="An 18 meter long dragon at Malang city park" />
<img src="img/ny3.jpg" alt="Actors perform the dragon dance" />

我正在用这个包装并显示标题:

$(".press img").each(function () {
var imageCaption = $(this).attr("alt");
var downloadLink = $(this).prop("src");
$(this).wrap("<div class='download'></div>");
if (imageCaption != '') {
    $("<span class='img-caption'><em>" + imageCaption + "</em><em> <a href=" + downloadLink + ">Download</a></em></span>")
        .insertAfter(this);
}

});

现在只需插入<a href="/ny1.jpg">Download</a>

任何帮助都会很棒

2 个答案:

答案 0 :(得分:0)

你快到了。您必须使用.split().替换img src值。试试这个:

$(".press img").each(function () {
var imageCaption = $(this).attr("alt");
var downloadLink = $(this).prop("src").split(".jpg")[0]+"_hires.jpg"; // split and add _hires.jpg
$(this).wrap("<div class='download'></div>");
if (imageCaption != '') {
    $("<span class='img-caption'><em>" + imageCaption + "</em><em> <a href=" + downloadLink + ">Download</a></em></span>")
        .insertAfter(this);
}
});

<强> DEMO

答案 1 :(得分:0)

试试这个

// Change this:
var downloadLink = $(this).prop("src");
// To this:
var downloadLink = $(this).prop("src")
  .replace(".jpg", "_hires.jpg")
  .replace(".png", "_hires.png");