jquery数据选择器

时间:2011-08-31 20:59:05

标签: jquery jquery-selectors

我正在尝试使用jquery数据选择器向元素添加/删除类。

$("#side_categories .testbox").click(function () {
    var category = $(this).data('category'); //get the category from the clicked button

    if ($('#side_categories .testbox').hasClass('activated')) {
        //otherInput is the hidden text input
        $('#listings .deals:data("category"="+category+")').removeClass('activated');
    } else {
        $('#listings .deals:data("category"="+category+")').addClass('activated');
    }
});

在我的测试框中,我在每个触发器上设置了数据类别以将其传递过来。进入数据类别的类别通过php填写。

似乎无法让它发挥作用,一直看到如下错误:

regular expression too complex
[Break On This Error] while (m = matcher.exec(expr)) { 

或者当我使用james padolsey编写的旧函数时,我得到以下内容:

uncaught exception: Syntax error, unrecognized expression: data

我只是希望能够根据复选框选择在LI中添加/删除类。

非常感谢提前!

4 个答案:

答案 0 :(得分:6)

制作它以便您可以按data值进行过滤:

$('#listings .deals').filter(function(index) {
    return $(this).data('category') == category;
}).removeClass('activated');

.filter() in jQuery doc


工作代码

$("#side_categories .testbox").click(function () {
    var category = $(this).data('category'); //get the category from the clicked button
    var these_deals = $('#listings .deals').filter(function (index) {
            return $(this).data('category') == category;
        });
    $('#listings .deals').removeClass('activated');
    if (these_deals.hasClass('activated')) {
        //otherInput is the hidden text input
        these_deals.removeClass('activated');
    } else {
        these_deals.addClass('activated');
    }
});

小提琴:http://jsfiddle.net/maniator/CcfwX/

答案 1 :(得分:2)

jQuery没有本地:data()选择器。您需要在$.expr[':'].data上明确定义它,或使用将其添加为选择器的插件。

答案 2 :(得分:0)

这样的事情会改变吗?

$("#side_categories .testbox").click(function () {
    var category = $(this).data('category'); //get the category from the clicked button
    $('#listings .deals[data-category*="' + category + '"]').toggleClass('activated');
}); 

答案 3 :(得分:-2)

尝试在类别周围使用单引号而不是双引号,如下所示:

...
$('#listings .deals:data("category"='+category+')').removeClass('activated');
} else {
$('#listings .deals:data("category"='+category+')').addClass('activated');
...

如果这不起作用,请尝试添加和删除双引号的各种组合,例如:

...
$('#listings .deals:data(category="'+category+'")').removeClass('activated');
} else {
$('#listings .deals:data(category="'+category+'")').addClass('activated');
...

我不是jQuery选择器的专家,但是你似乎试图在你的当前代码没有做的选择器中使用变量类别而不是字符串“+ category +”,因为选择器被单引号括起来而不是双引号。