I have input :
<form>
<input class="total" type="text" value="" readonly="readonly" />
</form>
And div :
<div class="product">
<figure>
<img src="img/1.jpg" alt="product 1" />
<!-- Hover -->
<figcaption>
<p>Add to input</p>
</figcaption>
</figure>
<p class="descript">Description</p>
<p class="price">99,00</p>
</div>
Question: How to increase input value by price in every click?
Now I increase only number of clicks.
First init your total by 0 :
<input class="total" type="text" value="0" readonly="readonly" />
And every time you click get total value and add product_price value to it, see worked example bellow.
Hope this helps.
$(".product").click(function() {
var product_price = parseFloat ( $('.price').text() );
var total = parseFloat ( $('.total').val() );
if( !isNaN( total ) )
{
$(".total").val( parseFloat( total + product_price));
}
}); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<input class="total" type="text" value="0" readonly="readonly" />
</form>
<div class="product">
<figure>
<img src="img/1.jpg" alt="product 1" />
<!-- Hover -->
<figcaption>
<p>Add to input</p>
</figcaption>
</figure>
<p class="descript">Description</p>
<p class="price">99,00</p>
</div>How about this one:
$(".product").click(function() {
if(!$(".total").val()){
$(".total").val((parseFloat($('.price').text())+1));
}
else{
$(".total").val((parseFloat($(".total").val())+1));
}
});
Use parseInt($('.price').html(), 10);
Check this:Updated Fiddle
$(".product").click(function() {
// pobieranie wartości
sum += parseInt($('.price').text(), 10);
// add to input value
$(".total").val(sum);
});
.html() in this case?