jQuery hasClass，是否可以给定类名的开头来获取完整的类名？

Question

我正在尝试做类似于这个问题，但有点不同，所以那里的解决方案对我不起作用。

<span class="a-class another-class test-top-left"></span>

我有一个元素（这段代码展示了一个，但它也可以是

、或其他任何东西）。这个元素有一个以test-开头的类（test-top-left、test-top-right等）。我已经触发了以test-开头的类的点击事件，并将被点击的对象保存为var object = this。到目前为止都很简单。

现在我想做的是获取该类的完整名称（test-top-left）。我知道它以test-开头，但完整名称是什么。问题是还有其他的类a-class、another-class和test-top-left。是否可以使用hasClass来获取类的完整名称？我不想使用find()或filter()，因为可能还有其他元素也具有class="test-"。

编辑：

我现在拥有的代码是，但它给我所有的类。我需要的是以test-开头的单个类。

var object = this;
$(object).attr('class'); 

所以现在我通过 for 循环遍历所有的类并分别测试每个类，这似乎是很多不必要的代码。我希望 jQuery 有一种聪明的方法可以立即获取被点击的确切类。

- sameold

---

如果一个元素有两个以 test- 开头的类，你的代码怎么知道你想要哪一个？ - Blazemonger

@Blazemonger 那不会是问题。单个元素不会有两个测试类。 - sameold

Answer 1

描述

您可以使用jQuery的属性包含选择器、.attr()和.click()方法。

属性包含选择器 - 选择具有包含给定子字符串的值的指定属性的元素。

.attr() - 获取匹配元素集合中第一个元素的属性值。

.click() - 将事件处理程序绑定到“click”JavaScript事件，或在元素上触发该事件。

示例

HTML

<span class="anyclass test-hello">Hello World</span>​

jQuery

$("[class*='test']").click(function() {
    var object = $(this);
    alert(object.attr("class").match(/(test-.*?)(?:\s+|$)/)[1])
;});

查看更新后的jsFiddle

更新

如果您不想使用正则表达式，可以这样做。

$("[class*='test']").click(function() {
    var object = $(this);
    alert("test-" + object.attr("class").split("test-")[1].split("-"))
;});

更多信息

• jQuery - 属性包含选择器
• jQuery - .attr()
• jQuery - .click()
• jsFiddle演示

注：以上内容涉及IT技术。

- dknaack

---

感谢更新。所以我猜 hasClass 不能在这里使用？我想要的是像 object.hasClass() 这样的东西，但只给出 hasClass 的一部分类名。 - sameold

是的，你不能使用hasClass来实现这个。我的回答有什么问题吗？这应该可以用startsWith实现hasClass。 - dknaack

Answer 2

这应该适用于您：

var object = this;
var className = object.className.match(/(test-.*?)(?:\s+|$)/)[1];

类名是你要查找的类的名称。

- dfsq

Answer 3

如果您不想使用split或regex，可以尝试将类放在单独的属性中。

<span class="someclass test-something" _rel="test-something">test<span> 

或者

<span class="someclass" _rel="test-something">test<span>

使用脚本

$("[_rel*='test-']").click(....

要检索属性，请使用$(this).attr("_rel")

- Vanamali