gpt4 book ai didi

javascript - 将类添加到与每个单击元素具有相同匹配类的元素

转载 作者:行者123 更新时间:2023-11-28 13:13:44 25 4
gpt4 key购买 nike

我需要将 .active 类添加到与我单击的 div 匹配的任何类的任何按钮:

<button class="valueA"></button>
<button class="valueB"></button>
<button class="valueC valueB"></button>

<div class="DYNAMIC CLASS"></div>
$("div.valueB").on("click", function() {
...
});

结果应该是:

<button class="valueB active"></button>
<button class="valueC valueB active"></button>

我尝试使用.each(),但我对类的比较感到困惑。

问题是我的 div 和那些按钮一样具有动态类,所以我不知道什么匹配,直到它们位于 DOM 中。

最佳答案

一个版本是为文档中的每个类创建一个单击函数。这看起来像这样:

$('.valueA').click(function() {
$('.valueA').addClass('active')
})
$('.valueB').click(function() {
$('.valueB').addClass('active')
})
$('.valueC').click(function() {
$('.valueC').addClass('active')
})

但是这是重复的代码,应该避免。因此,您可以创建一个函数,将单击处理程序添加到所有按钮(这是我编写的示例),然后检索附加到该元素的类。然后,它循环遍历类数组,并向具有该类的每个元素添加另一个元素。

$('button').click(function() {
var classes = $(this).attr('class').split(' ')
classes.forEach(function(elem) {

$('.' + elem).addClass('active');
})
})

现在,如果您想限制该类的应用,那么您可以在 之前添加该类应应用的元素类型。

$('button.' + elem).addClass('active');

$('div.' + elem).addClass('active');

关于javascript - 将类添加到与每个单击元素具有相同匹配类的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40441371/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com