我的元素中有一个图像,其中有一个悬停时显示的灯箱图像。我想用灯箱图像替换元素中的图像。我的内容是动态匹配的,我无法更改html。
我的所有图像网址都以/250/250 结尾 - 一些灯箱图像以/400/300 结尾 - 我使用下面的脚本来替换它们:
$('.new-structure .image a img').each(function () {
var src = $(this).attr('src');
$(this).attr('src', src.replace("/250/250", "/400/300"));
});
但是一些灯箱图像有另一个结局,我无法让脚本工作。它们看起来像这样:
/img/0~BC6F034B-3404-4FBA-B26A-9B2990552E72~400~300~1
如何将/250/250结尾的图片与400~300~1结尾的图片进行匹配?
更新:主要问题:当我用 300/400 替换 250/250 时,我不需要更改完整链接 - 除了结尾之外它们是相同的 - 当替换我需要的 ~400~300~1 图像时交换完整链接,因为它不同。
我需要更换这个:
https://mywebsite.com/imgs/2d873287-7eb5-497a-a813-aef655acdb74/250/250
这样:
https://mywebsite.com/img/0~3B07CED6-08FF-47CD-9D25-D908774F728D~400~300~1
基于引用图像尺寸的网址结尾:/250/250 和 ~400~300~1
更新:意识到根据元素类交换它们可能会更容易。
灯箱图像如下所示:
<a class="mainColorbox" href="/img/0~676B9DBB-5D93-4481-B241-74B619F96188~400~300~1"></a>
目标图像:
<div class="mainPicture">
<img src="/imgs/7fb6d7bd-b9e7-44b2-a533-a485b93456ac/250/250" class="photo">
最佳答案
使用正则表达式代码来替换字符串:
var str = 'some // slashes', replacement = '';
var replaced = str.replace(/\//g, replacement);
否则斜杠将像您的示例中那样进行编码。
在此处了解更多信息:How to globally replace a forward slash in a JavaScript string?
关于javascript - 用 jQuery 替换图像链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33912919/