Question

我正在使用jQuery，我有以下HTML代码：

<a href="/link" data-a='{"one":"sample1","two":"sample2"}' data-b="true">Title</a>

我想使用multiple attribute selectors找到上述链接，但是/ {包含data-*属性中的特定值。也就是说，我可以通过这种方式找到上述链接

selector = 'a[data-a][data-b]'
$(selector).bind(...)

但我希望通过查找包含data-a和data-b属性且其属性data-a包含one密钥的链接来更具体。

我该怎么做？

Answer 1

解析属性的内容超出了attribute selectors的范围。您需要通过filtering所选元素手动执行此操作：

$('a[data-a][data-b]').filter(function() {
    try {
        return "one" in JSON.parse($(this).attr("data-a"));
    } catch(e) {
        return false;
    }
}).on(…)

你当然可以implement a custom selector（或use a regex selector ¹），但这并没有多大区别。并且可能会大大降低性能。

_{1：呃，最好不要使用JSON。}

Answer 2

这将有效，但不保证数据-a是有效的json lol

select = 'a[data-a*=\'"one":"\'][data-b]';

使用＆＃39;包含＆＃39;选择器：http://api.jquery.com/attribute-contains-selector/

Answer 3

我们可以.filter()第一组集合，以确保元素的data- *属性是否包含特定键。

你可以这样做，

$('a[data-a][data-b]').filter(function(){
 return 'key' in JSON.parse($(this).data('a'));
}).bind(..)

如何使用多个属性选择器但是/具有特定的属性值？

3 个答案: