如何从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);
});               

我试图得到不同的价格和总结.现在我只添加第一个值.

小提琴

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以及更多这种类型的工作.