gpt4 book ai didi

jquery - 在 jQuery 中根据数据属性而不是类过滤元素

转载 作者:行者123 更新时间:2023-12-01 06:36:52 29 4
gpt4 key购买 nike

我正在研究一种简单的方法来根据元素的类来过滤元素。用户选中一个复选框,jQuery 就可以正常工作,并根据类关闭任何元素。关闭元素的行以及元素的外观是:

$('#ItemList div:not(.' + Filter + ')').hide();
<div class="1 2 3">asdf</div>

但是,我希望能够使用 data-xxxx 属性而不是 class 属性来执行此操作,但我在实际以这种方式选择元素时遇到了问题。我所拥有的如下:

$("#ItemList div:not([data-filter'" + Filter + "'])").hide();
<div data-filter="1 2 3">asdf</div>

那么,如何使用 data-filter 属性而不是类来选择元素呢?我在这里找到的方法对我不起作用!非常感谢。

更新

好的,詹姆斯·阿勒迪斯的回复成功了。但引起了另一个问题,我可能应该在原来的帖子中说。

每个 data-xxxx 属性可以有多个值,我需要这个过滤器工作,这样如果任何一个值出现,它就不会隐藏该元素。

$('#Filters input').change(function()
{
$('#ItemList div').show();
$('input').each(function()
{
var Checked;
if(Checked = $(this).attr('checked'))
{
var Filter = $(this).attr('data-filter');
$("#ItemList div:not([data-filter='" + Filter + "'])").hide();
};
});

<div data-filter="1">1</div>
<div data-filter="1 3">1 3</div>

例如,如果选中具有以下属性的复选框,它将显示两个 div:

data-filter="1"

但是如果属性是这样的,它只会显示第二个:

data-filter="3"

最佳答案

你很接近。您只是缺少 = 字符:

$("#ItemList div:not([data-filter='" + Filter + "'])").hide();
// ^ You missed this

这是一个working example .

关于jquery - 在 jQuery 中根据数据属性而不是类过滤元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12973491/

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