2014-07-04 48 views
-2

li項是可點擊的具有數據過濾器屬性的div。單擊時,我需要jQuery來確定是否有任何li項數據過濾器屬性與「filteringResults」容器中的任何div匹配。然後它將進入「filtersResults」容器,該容器只顯示與任何選定的li項目數據過濾器屬性匹配的div。如果數據屬性與另一個容器中的元素的id匹配,則過濾掉元素

<li data-filter='clm, ebusiness, seo'> 
    <div class="itemcontainer"> 
    <img src="site-resources/images/chat-32W.png" alt=""> 
    <div class="tick"></div> 
    </div> 
    <p>Engage</p> 
</li> 
<li data-filter='clm, facebookads, website'> 
    <div class="itemcontainer"> 
    <img src="site-resources/images/engineering-32W.png" alt=""> 
    <div class="tick"></div> 
    </div> 
    <p>Manage</p> 
</li> 

<ul id="filteringResults"> 
    <li id="clm">CLM</li> 
    <li id="ebusiness">EBusiness</li> 
    <li id="seo">SEO</li> 
    <li id="website">Webite</li> 
    <li id="facebookads">Facebook Ads</li> 
</ul> 

任何幫助將不勝感激。

感謝

+2

第一次嘗試的東西。卡住然後問。 – Yaje

回答

0

您可以使用attribute contains選擇這樣

$("li").click(function() { 
    alert($("[data-filter*=" + this.id + "]").data("filter")); 
}); 

Fiddle

+0

@ OllieRussell8這是否滿足您的需求? –

相關問題