jQuery 将类添加到图像链接，而不会在链接传递变量时弄乱

好的，所以我使用了一些 jquery 来选择所有<a>页面上的标签以及它们是否链接到图像文件以添加zoom出于灯箱的目的对其进行类处理。 这是有效的代码

$(document).ready(function () {
$('a[href*=".png"], a[href*=".gif"], a[href*=".jpg"]').addClass('zoom');
});

但这有一个问题；

假设我有一个链接，它只是转到另一个页面，但将图像 URL 作为 URL 中的 GET 变量传递，灯箱因此被激活，并失败，因为该链接实际上不是图像。例如：

<a href="http://example.com/a-normal-page/?pic=http://example.com/pics/picture.jpg">Link text</a>

在上面的实例中，jQuery 脚本会将缩放类添加到该锚点，即使它实际上并未链接到图片。 这通常不会成为问题，因为您会在灯箱有机会出现之前离开页面前往链接的目的地，但在打开新选项卡/窗口时，我会出现一个失败的灯箱。

这在社交媒体按钮上尤其普遍，例如 Pinterest，它在链接中传递图像 URL。

[对标题表示歉意 - 我不确定如何最好地表达它。请随意编辑为更合适的内容]

你可以添加zoom仅当href属性不包含?（或者，换句话说，不包括查询字符串），例如

$(document).ready(function () {
    $('a[href*=".png"], a[href*=".gif"], a[href*=".jpg"]').each(function() {
        if (this.href.indexOf('?') < 0) {
             $(this).addClass('zoom');
        }
    });
});