匹配单个属性数据值的多个属性数据值 [英] match multiple attribute data-value against single attribute data-value

问题描述

我如何使用具有多个属性值的元素，选择单匹配div的属性值，要么显示或隐藏这些匹配的div的。我已经得到了相反的在这里工作（具有多个属性，单attritbute匹配格）：的http：//的jsfiddle。净/ jtspetersen / cEgvB / 2 /

How can I use an element with multiple attribute values to select divs with single matching attribute values and either show or hide those matching divs. I've got the opposite working here (single attritbute matching div with multiple attributes): http://jsfiddle.net/jtspetersen/cEgvB/2/

从本质上讲，我有'X'的位置和Y的教训。我想唯一的属性值分配到每节课，当我点击位置X的多属性值的链接，我想多属性选择器匹配的教训显示。

Essentially, I have 'X' Positions and "Y" lessons. I want to assign a unique attribute-value to each lesson, and when I click the link of Position X with multiple attribute-values, I want the lessons matching the multiple attribute selector to show.

<a class="pos" href="#" data-position="1 2 4">Your Position 1</a>
<a class="pos" href="#" data-position="3 4">Your Position 2</a>
<br />

<div id="title"><em>Lessons</em></div>
<div id="lesson1" class="lesson" data-lesson="1">Lesson 1</div>
<div id="lesson2" class="lesson" data-lesson="2">Lesson 2</div>
<div id="lesson3" class="lesson" data-lesson="3">Lesson 3</div>
<div id="lesson4" class="lesson" data-lesson="4">Lesson 4</div>

所以，当我点击位置1时，看到的经验教训2，3，4。

So when I click Position 1, Is see lessons 2, 3, 4.

很抱歉，如果这已经回答了，但我没能找到任何干净做到这一点。

Sorry if this has been answered, but I wasn't able to find anything that cleanly does this.

推荐答案

您不得不分割位置列表，检查每节课

You'd have to split the position list and check each lesson

$('.pos').on('click', function() {
    var arr = $(this).data('position').split(/\s+/);

    $('.lesson').hide().filter(function() {
        return $.inArray( $(this).data('lesson').toString(), arr ) != -1;
    }).show();
});

FIDDLE

这篇关于匹配单个属性数据值的多个属性数据值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！