從動態表單獲取更大價值的輸入

Question

我有下面的HTML，我想使用jQuery找出id以a開頭的所有input元素，其值大於id以b開頭的id 。 對於此示例，下面的結果將選擇它為#a2和#a3 。

<div class="form">
    <input id="a1" value="1" />
</div>
<div class="form">
    <input id="b1" value="5" />
</div>

<div class="form">
    <input id="a2" value="3" />
</div>
<div class="form">
    <input id="b2" value="1" />
</div>

<div class="form">
    <input id="a3" value="2" />
</div>
<div class="form">
    <input id="b3" value="1" />
</div>

<div class="form">
    <input id="a4" value="1" />
</div>
<div class="form">
    <input id="b4" value="5" />
</div>

...

Answer 1

您可以將.filter()與可比較兩個值的條件一起使用：

$('[id^=a]').filter(function(){
   return parseInt($(this).val(),10) > parseInt($(this).parent().next().find('input').val(),10) 
});

工作演示

更新：獲取與條件匹配的元素的ID

$('[id^=a]').filter(function(){
    return parseInt($(this).val(),10) > parseInt($(this).parent().next().find('input').val(),10) 
}).map(function(){
    return $(this).attr("id");
}).get().join("-")

演示

Answer 2

您可以使用“屬性始於”選擇器和filter()來實現：

var $a = $('[id^="a"]').filter(function() {
    var aVal = parseInt($(this).val(), 10);
    var bVal = parseInt($(this).closest('.form').next().find('input').val(), 10);
    return aVal > bVal;
});

$a變量現在將包含a元素，其值比其直接同級b更高。

如何獲取ID a =“”結尾的所有數字到數組中？

為此，您可以使用map() ：

var aValues = $a.map(function() {
    return this.value;
}).get();
console.log(aValues); // shows all the larger A values gathered.