在 jQuery 中查找匹配的类名

我在一个页面中有一系列图像缩略图。它们是使用 CSS 精灵创建的。

<div class="galleryImg1"></div>
<div class="galleryImg2 featured"></div>
<div class="galleryImg3"></div>

我原来用的是id="galleryImg1"但改为使用class="galleryImg1"因为图像可能会出现在同一页面上的多个位置，并且我想避免重复的 ID。

我有一个 jQuery 选择器将单击事件附加到所有这些类。

$("[class^=galleryImg]").click(function() {
   // how do i get 'galleryImg2' and '2' here?
}

我想知道是否有一种简单的方法可以找出单击的以“galleryImg”开头的类名。我必须使用正则表达式还是有“更聪明”的方法？

（是的，如果我使用 #ID 选择器，那么我可以只说“this.id”，但正如前面提到的，我不想使用 ID，因为我想显示同一图像的多个副本。）

据我所知，您将需要一个非常基本的正则表达式，如下所示：

$("[class^=galleryImg]").click(function(Event) {
    var id = this.className.match(/galleryImg(\d+)/)[1];
    console.log(id);
});

不过，如果您特别反对这样做，您可以使用类似的东西，它不会验证，但会完成工作。

<div class="galleryImg1" image_id="1"></div>
<div class="galleryImg2 featured" image_id="2"></div>
<div class="galleryImg3" image_id="3"></div>

<script>
$("[class^=galleryImg]").click(function(Event) {
    var id = $(this).attr('image_id');
    console.log(id);
});
</script>

因为我假设您可以完全控制 HTML，并且您知道 galleryImg 类后面总是跟着 ID，所以我认为这里的正则表达式根本不是邪恶的。放手去做！