JQuery基於多個子值的選擇

我需要從我的頁面中選擇一個div（帶有一類數據），其中一個孩子具有特定值（Test1），另一個孩子具有另一個值（User1）;JQuery基於多個子值的選擇

舉例來說，我想在這個例子中，選擇div.data（注用戶1在div.user）

<div class="data"> 
    <div> 
     <div class="details"> 
     Test1 
     </div> 
     <div class="user">User1</div> 
    </div> 
</div>

但不是這個（注中的user2 div.user）：

<div class="data"> 
    <div> 
     <div class="details">Test1</div> 
     <div class="user">User2</div> 
    </div> 
</div>

我試着寫一個查詢使用:has，但它既選擇了兩個div，也不選擇。

$("div.data:has(div.details:contains('Test1'), div.user.contains('User1'))")

如何在這種情況下編寫查詢來獲得div.data？

澄清：我最初沒有明確的，但我需要選擇div.data當用戶div包含「用戶1」和細節div包含值「測試1」。即這兩個條件必須爲div.data才能被選中。

來源

2014-01-21 Obsidian Phoenix

我不認爲是包含了用例最適合的，還是儘量

$('div.data:has(div.details:contains("Test1")):not(:has(.user:contains("User2")))').css('color', 'red')

演示：Fiddle

$('div.data').filter(function() { 
    var $this = $(this); 
    return $.trim($this.find('.details').text()) == 'Test1' && $.trim($this.find('.user').text()) != 'User2' 
}).css('color', 'red')

演示：Fiddle

來源

2014-01-21 13:03:33

可能的工作，但用戶2可以是任何其它值除了用戶1。即有許多用戶，但我只對一個特定的（現在）感興趣 –

工作，謝謝。 –

試試這個：

$(".data").find("div.user:contains('User1')").parents("div.data")

演示：http://jsfiddle.net/abhitalks/LvJ7Z/1/

你的要求是，只能選擇div S的是有（用類data的div後代），它包含文本「用戶1」一類的user。請記住，contains區分大小寫。

來源

2014-01-21 13:04:00 Abhitalks

我已經更新了這個問題來澄清，但我需要當* *用戶div有User1 *和*詳細信息div包含「Test1」 –

您應該嘗試考慮爲您的數據添加類，這樣您可以實際上選擇您需要的數據。

如果你仍然想接近這種方式，最好用這個做：

$('.data').each(function(){ 

    var thisData = $(this); 

    // Uncomment if you want to find by specific siblings 

    if($('.user:contains(\'User1\')', thisData).length) 
    //if($('.details .details', thisData).length) 
    { 
     // Do whatever as you like 
     thisData.css('background', 'green'); 
    } 
});

DEMO

來源

2014-01-21 13:04:28 MacMac

不幸的是，頁面不在我的（我正在寫一個Chrome content_script擴展名），所以我只能在那裏工作。 –

此外，我已通過澄清更新了該問題。 –

JQuery基於多個子值的選擇

回答

相關問題