jQuery循环遍历列表项并检查子值

Question

我正在尝试遍历一些列表项并检查子字段“.price”的值。 这是我正在使用的代码。

var item = jQuery(".product_overview li")

jQuery(item).each(function() {
var itemPrice = jQuery(".product_overview li .price").html();
alert(itemPrice);  
});

但是每个循环都给了我第一个孩子的价值..

HTML

<ul class="product_overview">
<li><span class="price">20</span></li>
<li><span class="price">40</span></li>
<li><span class="price">60</span></li>
</ul>

Answer 1

如果你想要一个数组中的所有价格，

var prices = $.map($('.product_overview li'), function(){
    return this.querySelector('.price').innerHTML;
});

Answer 2

将您的代码更改为：

var item = jQuery(".product_overview li")
jQuery(item).each(function() {
    var itemPrice = jQuery(this).find(".price").html();
    alert(itemPrice);  
});

或者只是将整个内容重写为：

jQuery(".product_overview li .price").each(function () {
    console.log(jQuery(this).html());
});

jsFiddle example

Answer 3

尝试使用this 引用作为该选择器的context，

jQuery(item).each(function() {
  var itemPrice = jQuery(".price",this).html();
  alert(itemPrice);  
});

DEMO

作为特殊情况，您在 UL 元素 clas="product_overview" 的 class 属性中错过了一个 s，请尝试在您的代码中更正它。