javascript - 如何使用javascript将以前的余额添加到当前余额
问题描述
php
<div class="col-md-2">
Amount<input type="text" name="edit_amount" id="edit_amount" class="form-control" onkeypress="isInputNumber(event)"/>
</div>
<div class="col-md-2">
Cash Tendered</strong>: <input type="text" name="edit_payment" id="edit_payment" class="form-control"onkeypress="isInputNumber(event)"/>
</div>
<div class="col-md-2">
Change </strong>: <input type="text" name="edit_change" id="edit_change"readonly="" class="form-control"/>
</div>
<div class="col-md-2">
Balance</strong>: <input type="text" name="edit_balance" id="edit_balance"readonly="" class="form-control" value="<?php echo $row['balance'] ?>" />
</div>
此行余额是患者最后一笔交易的余额。此回声余额查看/检查患者的剩余余额。
Javascript
$(function() {
$("#edit_payment").on("keydown keyup", sum);
function sum() {
var textValue1 = Number.parseFloat(document.getElementById('edit_payment').value);
var textValue2 = Number.parseFloat(document.getElementById('edit_amount').value);
if (textValue1>=textValue2) {
document.getElementById('edit_balance').value = "0";
document.getElementById('edit_change').value = textValue1 - textValue2;
}
else if(textValue1<textValue2){
document.getElementById('edit_change').value = "0";
document.getElementById('edit_balance').value = textValue2 - textValue1;
}
}
});
我的问题是,如果患者再次交易并且患者将有另一个余额,我想要添加以前的余额和当前余额。
例如,
患者在上次交易中的先前余额中有 100 美元 然后患者将再次进行交易,交易总额为 200 美元,然后患者支付 50 美元,因此余额为 150 美元。然后该患者的总余额将变为 250 美元,因为之前的 100 美元,然后是当前的 150 美元。
解决方案
您的代码中有两个问题:
isInputNumber
已绑定,#edit_payment
因此 jQuery 回调将无法正常工作。- 如果你想减少每个事件的余额,你必须在事件监听器之前的某个地方
keyup
存储第一个 balance( )。$row['balance']
const parseNumber = function(value) {
value = parseFloat(value);
if (isNaN(value)) {
value = 0;
}
return value;
}
const balanceInput = $("#edit_balance");
const paymentInput = $("#edit_payment");
const balance = parseNumber(balanceInput.val());
$("#edit_payment").on("keyup", function() {
let tmpBalance = balance;
let amount = parseNumber(paymentInput.val());
if (tmpBalance >= amount) {
tmpBalance = tmpBalance - amount;
}
balanceInput.val(tmpBalance);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-md-2">
Amount<input type="text" name="edit_amount" id="edit_amount" class="form-control" />
</div>
<div class="col-md-2">
Cash Tendered</strong>: <input type="text" name="edit_payment" id="edit_payment" class="form-control"/>
</div>
<div class="col-md-2">
Change </strong>: <input type="text" name="edit_change" id="edit_change"readonly="" class="form-control"/>
</div>
<div class="col-md-2">
Balance</strong>: <input type="text" name="edit_balance" id="edit_balance"readonly="" class="form-control" value="40" />
</div>
推荐阅读
- html - iPhone上的页脚隐藏的表格内容
- reactjs - 当我尝试使用 react-router-dom 单击同一页面的同一链接时,超过了最大更新深度
- ios - 给定特定行 indexPath 如何从 UICollectionView 获取所有单元格
- python - HttpTrigger 使用python依次执行
- amazon-s3 - AWS - 使用 S3 存储桶中的电子邮件模板
- python-3.x - 已知和未知行上的数据分区
- elasticsearch - 保护 Kibana/ElasticSearch 的内置用户凭证
- jvm - 被普罗米修斯刮擦后,千分尺的度量(在弹簧靴中)会保留在堆中吗?
- mysql - 返回另一个表中的外键数
- postgresql - 如何更改 Postgres(Docker)上的用户之一的密码?