Question

我在这里有一个div：

<div id="divCheckbox" >
     <div class="input-group px-1 py-1" >
     <span class="input-group-addon">Wallet</span>
     <span id="amount_of_money" class="input-group-addon unique"></span>
     <span class="input-group-addon">JPY</span>
</div>

以及表格

<form action="includes/Payment.inc.php" method="get" class="px-4 py-4" id="Payment" >
     <div class="input-group">
        <span class="input-group-addon">$</span>
        <input type="text" class="form-control" name="amount" aria-label="Text input with checkbox" id="PaymentValue">
        <span class="input-group-addon">JPY</span>
        <button type="submit" name="submit" class="btn btn-primary m-4 border rounded">Submit</button>
     </div>
</form>

我想要做的就是点击提交按钮时，表单中的值总计为跨度amount_of_money 这就是我想出的：

PaymentForm.submit(function (event) {
    event.preventDefault();
    Add();
});

function Add() {
    var PaymentValue = $('input[id=PaymentValue]').val();
    var Number = parseInt(PaymentValue);
    var money_span = $("#amount_of_money");
    if(Number > 0) {
        var sum = parseInt(money_span.val()) + parseInt(PaymentValue);
        money_span.text(sum);
    }
}

当我测试时，跨度amount_of_money中的值变为Nan，有什么方法可以修复它吗？

Answer 1

money_span是一个范围，而不是输入，因此您无法使用money_span.val()，您应该使用money_span.text()。如果它是空的，就像首次加载页面时一样，parseInt()将返回NaN;您需要检查并使用0作为其值。

＆＃13;

PaymentForm = $("#Payment");

PaymentForm.submit(function(event) {
  event.preventDefault();
  Add();
});

function Add() {
  var PaymentValue = $('input[id=PaymentValue]').val();
  var Number = parseInt(PaymentValue);
  var money_span = $("#amount_of_money");
  var oldmoney = parseInt(money_span.text());
  if (isNaN(oldmoney)) {
    oldmoney = 0;
  }
  if (!isNaN(Number) && Number > 0) {
    var sum = oldmoney + Number;
    money_span.text(sum);
  }
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="divCheckbox">
  <div class="input-group px-1 py-1">
    <span class="input-group-addon">Wallet</span>
    <span id="amount_of_money" class="input-group-addon unique"></span>
    <span class="input-group-addon">JPY</span>
  </div>

  <form action="includes/Payment.inc.php" method="get" class="px-4 py-4" id="Payment">
    <div class="input-group">
      <span class="input-group-addon">$</span>
      <input type="text" class="form-control" name="amount" aria-label="Text input with checkbox" id="PaymentValue">
      <span class="input-group-addon">JPY</span>
      <button type="submit" name="submit" class="btn btn-primary m-4 border rounded">Submit</button>
    </div>
  </form>

＆＃13;

在jquery中将表单中的数字添加到div中

1 个答案: