javascript - jquery hasClass,可不可以给类名开头,获取全类名

Question

我正在尝试做类似于 this question 的事情，但它有点不同，所以那里的解决方案对我不起作用。

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

我有一个元素(这段代码显示了一个 span 但它可以是 div span 或任何东西)。此元素有一个以 test- 开头的类(test-top-left、test-top-right 等)我触发了一个在以 test- 开头的类上单击事件并将单击的对象保存为 var object = this;。简单的东西到此为止。

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

编辑:

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

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

所以现在我 for 循环遍历所有类并分别测试每个类，这看起来像是很多不必要的代码。我希望 jQuery 有一个聪明的方法来立即获得被点击的确切类。

Answer 1

描述

您可以使用 jQuerys Attribute Contains Selector、.attr() 和 .click() 方法。

Attribute Contains Selector - Selects elements that have the specified attribute with a value containing the a given substring.

.attr() - Get the value of an attribute for the first element in the set of matched elements.

.click() - Bind an event handler to the "click" JavaScript event, or trigger that event on an element.

示例

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 - Attribute Contains Selector
• jQuery - .attr()
• jQuery - .click()
• jsFiddle Demonstration