我想要toggle a class基于某些条件我必须根据已处理元素的 ID 计算:
$(".centre li").toggleClass("highlight", someFunction(x));
(这将选择大约 10 个列表元素。我需要每个元素的 ID 来查找是否需要突出显示。)
someFunction(selectedElement) {
if (selectedElement.id in someArray)
return true
else
return false
}
我可能在闭包 hell 中迷失了方向,但是函数中的this
被设置为另一个元素。这是真正的代码:
...
showListItem = function(linkSelector, listSelectors, contentSelector) {
return function() {
$(".centre li").toggleClass("backgroundFullOrange", test(this));
function test(a) {
console.log($(a).attr("id")); // -> id of the linkSelector-element
}
}
};
$(linkSelector).bind('click', showListItem(linkSelector, listSelectors, contentSelector))
...
更新:事实证明,toggleClass() 不是我一直在寻找的函数。请参阅已接受的答案以了解正确的用法。
最佳答案
首先,$(".centre li").toggleClass("highlight", someFunction(x));
不是正确的语法。第二个参数是 switch
,定义如下,
switchA boolean value to determine whether the class should be added or removed.
switch 不能是您拥有的函数。
在您的情况下,您必须调用 .removeClass('highlight')
,然后调用 addClass
,您可以在其中比较元素的 ID 并返回突出显示或''。
参见演示,每 1.5 秒随机突出显示 2 里。
$(".centre li")
.removeClass('highlight')
.addClass(function () {
return ($.inArray(this.id, someArray) >= 0)?'highlight': '';
});
我想这次我理解正确了。见下文,
$(function() {
var someArray = ['l1', 'l8'];
$(".centre li").toggleClass(function() {
return ($.inArray(this.id, someArray) >= 0)?'highlight':'';
});
});
尝试使用.filter
。像下面这样,
$(".centre li").filter(function() {
return $.inArray(this.id, someArray);
}).toggleClass("highlight");
突出显示只会添加到过滤器返回的那些元素。
关于jquery toggleClass() - 访问选定的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10047339/