I have a simple calculator which works fine on desktop, it updates automatically as you are changing the values of the input. The issue that I am having is that it doesn't work on iPhone / iPad, just seems it's not firing. Any ideas on how to correct this?
HTML
<label for="beer-lines">Number of beer lines</label>
<br>
<input type="text" value="10" id="beer-lines" class="savings-calc" name="beer-lines">
<br>
<br>
<label for="pints-line">Number of pints pulled through when cleaning each line</label>
<br>
<input type="text" value="3" id="pints-line" class="savings-calc" name="pints-line">
<br>
<br>
<label for="pints-one">Price for one pint</label>
<br>
<input type="text" value="3.5" id="pints-one" class="savings-calc" name="pints-one">
<br>
<br>
<span id="savings-total">£<span id="value">4095.00</div></div>
jQuery
$(document).ready(function() {
$('.savings-calc').bind("propertychange keyup input paste", function(event) {
var price = 0;
var default_cost = 39;
var beer_lines = $('#beer-lines').val();
var pints_line = $('#pints-line').val();
var pints_one = $('#pints-one').val();
var total = (default_cost * beer_lines * pints_line * pints_one).toFixed(2);
$('#savings-total #value').text(total);
});
});
CODEPEN
