javascript - jquery中如何根据div的hover获取类名

Question

我正在寻找一种基于悬停在 div 上来获取类名的方法。两个 div 具有相同的 id，但类名略有不同。看一下下面的例子:

<div id="1-someid" class="1-example-class border cz">
...more element goes here....
</div>

和

<div id="2-someid" class="2-example-class border cz">
...more element goes here....
</div>

更新:我根据下面发布的专家意见将 ID 名称设置为唯一。 :) 感谢您的所有帮助。

现在我想要的是，当用户将鼠标悬停在带有 1-example-class 的 div 上时，它将返回类名 1-example-class。当人们将鼠标悬停在带有 2-example-class 的 div 上时，它会返回我 2-example-class 名称。

这样我就可以在该名称上使用 parseInt() 来获取数字，1、2、3 等等。

另请注意，仅为 1-example-class 或 2-example-class 编写静态脚本不会有帮助，因为还有更多这样的 div附有 3、4、5 等。

有人可以帮忙吗？我已尝试以下方法，但没有帮助。

$('#someid').hover(function() {
        var class_names = $(this).attr('class');

        var class_name = class_names.split( ' ' ); 

        var c = parseInt( class_name[0] );

        console.log( c );
});

如果有人可以提供帮助，那将非常有帮助。

Answer 1

属性选择器和正则表达式是正确的选择:

$("[class*=example-class]").hover(function() {
    var c = this.className.match(/(\d+)-example-class/)[1];
    console.log(c);
});

• $("[class*=example-class]") 匹配其类的所有元素 属性包含“example-class”字符串。

• this.className.match(/(\d+)-example-class/)[1] 给出相关 数量。