Question

我想计算输入字段的百分比。第一个字段在第二个字段中将有一个静态值，用户应输入一个百分比值，此代码应获得第一个值（静态）计算由输入的百分比用户根据第一个静态值并将最终值添加到最终结果中。这是我完成的一些代码但这只是基本上添加两个数字而我想添加用户输入的第二个字段的百分比到第一个并在最终总标题中显示

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

</head>
<body>
<input style="max-width: 100px; type="number" min="0" type="text" id="quantity1" value="100" />
<input style="max-width: 100px; type="number" min="0" type="text" id="quantity2" />

<h5 class="total" id="total" value="$123"></h5>

</body>
<script>
$('#quantity2').on('keyup',function(){

    var val=$('#quantity1').val();
    alert(val);
    //alert(val);
    var tot = +$(this).val()+ +$('#quantity1').val() ;
    alert(tot);
    $('.total').html("$"+tot);
});
</script>
</html>

Answer 1

试试这个：

＆＃13;

$('#quantity2').on('change',function(){ // use .change() event instead of keyup
    var val1 = parseInt($('#quantity1').val()); // use parseInt() to convert string to integer value
    var val2 = parseInt($(this).val());
    var tot = val1 + (val1 * (val2 / 100)); // it will add percentage value to first value
    console.log(tot);
    $('.total').html("$"+tot);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<input style="max-width: 100px;" type="number" min="0" type="text" id="quantity1" value="100" />
<input style="max-width: 100px;" type="number" min="0" type="text" id="quantity2" />

<h5 class="total" id="total" value="$123"></h5>

＆＃13;

为结果添加值百分比

1 个答案: