拆分类并将它们与另一个 DIV 匹配。 jQuery

Posted 2023-05-09

【中文标题】拆分类并将它们与另一个 DIV 匹配。 jQuery

【英文标题】：Splitting classes & matching them against another DIV. JQuery

【发布时间】：2012-01-28 16:09:03

【问题描述】：

我有一个名为 box 的 div，其中包含三个类。我想创建一个名为 relatedBoxes 的变量，用于存储共享 box 具有的任何相同类的复选框。

我正在拆分这些类并将它们存储在名为 splitClass 的变量中。

我现在只需要查看:checkbox 是否包含保存在splitClass 中的任何类的方法。我尝试过创建变量relatedBoxes，但这并不完全奏效。

标记：

<div id="box" class="marker blue large">

javascript：

var c = $('#box').attr('class');
var splitClass = c.split(' ');

var relatedBoxes = $(':checkbox').hasClass(splitClass);

非常感谢大家

【参考方案1】：

hasClass 需要一个类名，您现在正在向它传递一个数组。如果您尝试使用marker、blue 或large 查找所有 元素，类似：

var relatedBoxes = $( ':checkbox' ).filter( '.' + splitClass.join( ',.' ) );

【讨论】：

+1 我喜欢这样。也许和filter一起：$('input[type="checkbox"]').filter('.' + splitClass.join( ',.' ))。

@FelixKling -- 就是这么做的 :)

这看起来不错，给我一点时间来测试一下。希望它将存储与任何这些类匹配的所有复选框！感谢您的回答！

@CecilTheodore——就是这样。它最终解析为 $( ':checkbox' ).filter( '.marker,.blue,.large' ) -- , 是 jQuery 选择器中的“或”运算符

这很酷。真的简化了。 +1 狼！也解决了。

【参考方案2】：

您可以使用.filter() ^[docs] 并遍历元素的类：

var splitClass = $('#box').attr('class').split(' ');

var relatedBoxes = $('input[type="checkbox"]').filter(function() 
    for(var i = 0, len = splitClass.length; i < len; i++) 
        if($(this).hasClass(splitClass[i])) return true;
    
    return false;
);