Question

我正在尝试访问与回调函数中的jQuery选择器匹配的类。例如，如果我有以下HTML，

<p class="someclass sorted-1 anotherclass">test</p>

我想匹配此元素并获取sorted-1类名。值1是任意的。类似于以下内容。 getMatchedClass()是伪代码。我以为可以从$(this)获得价值，但我没有看到它。

$('[class*=sorted-]').on('click', function() {
    var className = getMatchedClass();
    console.log(className); // should output 'sorted-1'
});

有人知道这是否可能吗？我很难找到搜索字词。我一直在选择的值上得到结果，这不是我想要的。

谢谢

更新

基于@ maheer-ali的回答，我提出了以下解决方案。

   $(function() {
        function column(className) {
            const regex = /sorted-([0-9]+)/;
            return className.match(regex)[0].replace(regex, '$1');
        }
        $('[class*=sorted-]').each(function(i, r) {
            // col is the dashed number after sorted
            // if parsing `sorted-42`, `col` would equal 42
            const col = column($(r).context.className);

            // Use the `col` value here.
            $(r).doSomething({ column: col });
        });
    });

Answer 1

您可以使用match()和正则表达式。并获得结果数组的第一个元素。

$('[class*=sorted-]').on('click', function() {
    var className = this.className.match(/sorted-[0-9]+/)[0];
    console.log(className); // should output 'sorted-1'
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p class="someclass sorted-1 anotherclass">test</p>

另一种方法是使用split()和startsWith()。 split() className " "并使用find()以startsWith字符串"sorted-"来获取元素element

$('[class*=sorted-]').on('click', function() {
    var className = this.className.split(' ').find(x => x.startsWith('sorted-'))
    console.log(className); // should output 'sorted-1'
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p class="someclass sorted-1 anotherclass">test</p>

Answer 2

您传递的回调函数是由触发它的事件调用的。

您可以访问event.target.classList以获取该对象上所有类的数组。如果您要查找一组固定的类模式，则可以在列表中搜索该类。

希望这对您有所帮助！

捕获与jQuery回调函数匹配的类

2 个答案: