javascript - 如何从id中提取元素？

Question

问题:如何从id中提取元素？

HTML :

<div class="product">
    <p id="price1">99,00</p>
</div>
<div class="product">
    <p id="price2">101,00</p>
</div>
<div class="product">
    <p id="price3">50,00</p>
</div>
<div class="product">
    <p id="price4">1,99</p>
</div>
<div class="product">
    <p id="price5">2,01</p>
</div>

JS :

var sumPrice = 0;

$(".product").click(function() {    

    if ( i = 1) sumPrice += parseFloat($( "#price" + i ).text())
    else if ( i = 2) sumPrice += parseFloat($( "#price" + i ).text())
    else if ( i = 3) sumPrice += parseFloat($( "#price" + i ).text())
    else if ( i = 4) sumPrice += parseFloat($( "#price" + i ).text())
    else if ( i = 5) sumPrice += parseFloat($( "#price" + i ).text())

    $(".total").val(sumPrice);
});               

我正在尝试获取不同的价格并进行总结。现在我只添加第一个值。

Fiddle

Answer 1

怎么样:

$(".product").click(function() {   
    sumPrice += parseFloat($( this ).text())
    $(".total").val(sumPrice);
});  

工作JsFiddle .
正如@bilyonecan 还指出的那样，您可能希望将 , 替换为 .，以便将值正确解析为 float 。您可以使用 .replace(',', '.') 对 $( this ).text() 进行简单替换，生成代码:

$(".product").click(function() {   
    sumPrice += parseFloat($( this ).text().replace(',', '.'))
    $(".total").val(sumPrice);
});  

---

如果你真的想找出被点击项目的id，你可以使用:

this.id; //gives the id of the clicked element. (javascript style)
$(this).prop('id') //or jQuery style (id of clicked element) 
$(this).children().first().prop('id'); //gives the id of the first child element (<p> in your case) 

---

$this 在 jQuery/Javascript 中

对象 $this 是函数或监听器所属的对象，在您的情况下，它是被单击并具有此单击处理程序的对象。 $this 非常方便，旨在以这种方式使用，这样您就不需要带有计数器的 ID 和更多此类解决方法。