查找第一個元素數據屬性大於零的JQuery

Question

我有div的列表與類.item-wrap

目前，我使用下面的代碼

$(".item-wrap:first").trigger("click"); 

每個.item-wrap有data-amount選擇的第一個div屬性。

如何修改當前代碼以選擇data-amount大於0的第一個.item-wrap？

Answer 1

可以使用each()使用return false;

$('.item-wrap').each(function() { 
    if (+$(this).data('amount') > 0) { 
     // Do "Hello World" here 
     $(this).trigger('click'); 

     // Breakout 
     return false; 
    } 
}); 

Answer 2

使用filter功能遍歷從環的元素和出口，我們可以限制我們的搜索。要通過它的數據屬性選擇一個元素，jQuery有一個方便的data()函數。

這可能會顯示多個結果，如我的示例中所示。要獲得第一個，您可以使用first方法。

$("div").filter(function() { 
 
    return $(this).data("amount") > 0; 
 
}).first().css({"color": "green"});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div data-amount="-7">On Tuesday I lost 7 dollars gambling</div> 
 
<div data-amount="-3">On Wednesday, I lost 3 dollars gambling</div> 
 
<div data-amount="37">On Thursday, I actually won 37 dollars</div> 
 
<div data-amount="16">I'm on a roll. Won 16 more dollars today</div>

一些注意

• 如果您的數據屬性不完全的數字組成，該代碼將無法正常工作。假定您所有的data-amounts都具有與正則表達式匹配的值：\A\d*\z

• 如果字符串與特定模式匹配，則可以將字符串與數字進行比較。這是因爲JavaScript執行自動類型轉換。在這個例子中，這是相當平凡的，因爲我們沒有很多數據。但是，如果你有更多的div，你可能想要做類似+$(this).data("amount") > 0