在 JS/jQuery 中将一个变量加(或乘、减或除)另一个变量

Add (or multiply, subtract or divide) one var to another in JS/jQuery

如果有人在其他地方提出并回答了这个问题,我深表歉意,我一直在努力寻找准确的搜索词。

在 jQuery 工作,我有一个 var 叫做 total。我需要将其他 vars 的值添加到 total。所有 vars 都有数值。

这是我试过的:

var total = total+rocketspend;
$(".totalamount").html(total);

var newtotal = total+rocketspend;
var total = newtotal;
$(".totalamount").html(total);

两者都导致 .totalamount 被清空并被替换为空。我有关于为什么这可能会出错的理论 - 可能是在第一个示例中 var 不允许自我定义,并且可能是在第二个示例中浏览器尝试同时定义newtotaltotal同时出现,神秘收场。或者它可能完全是别的东西。 rocketspend var 本身工作正常,total 在尝试添加之前也是如此。

想法?

你只需要在第一次定义变量时使用var。看起来您正在尝试访问一个已经存在的变量。示例:

var total = 0;
var rocketspend = 10;

total = total + rocketspend;
$(".totalamount").html(total);

此外,请尝试检查您的控制台是否有任何错误。在大多数浏览器中,您可以右键单击并检查一个元素或单击 Ctrl + Shift + I 和单击控制台选项卡。您可以在 Firefox 中使用 Ctrl + Shift + K

您正在使用 jQuery 并引用了一个元素(即 .totalamount),因此假设您使用的是普通网页(即 HTML、CSS、JS/jQ 等等),这个片段有 2 <forms>。第一个仅使用 JavaScript 和 HTML5。第二种形式使用jQuery和HTML5.

当使用 <input> 等表单域时,您在其中键入的值将是一个字符串(即文本)值。因此,当输入“3”时,<input> 会将其视为文本而不是实数值。因此将字符串转换为数字,使用 parseFloat()parseInt()Number().

要获得 <input> 值,请使用 .val() (jQuery) 或 .value (JavaScript)。

片段

$('#calc1').on('input', function() {
  var rocket1 = $('#rocket1').val();
  var sub1 = $('#sub1').val();
  var total1 = parseFloat(sub1) + parseFloat(rocket1);
  $("#total1").val(total1);
});
input {width: 8ex;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Using only plain JavaScript and HTML5 form fields</p>
<form id="calc" name="calc" oninput="total.value = parseFloat(sub.value, 10) + parseFloat(rocket.value, 10)">
  <fieldset>
    <legend>Rocket Expenditure</legend>
    <label for="sub">
      <b>Sub Total:</b>
      <input type="number" id="sub" name="sub" value="0">
    </label>&nbsp;&nbsp;&nbsp;+&nbsp;&nbsp;&nbsp;
    <label for="rocket">
      <b>Rocket:</b>
      <input type="number" id="rocket" name="rocket" value="0">
    </label>
    <label>
      <b>Total:</b>
      <output name="total" for="sub rocket">0</output>
    </label>
  </fieldset>
</form>
<p>Using jQuery and HTML5 form fields</p>
<form id="calc1" name="calc1">
  <fieldset>
    <legend>Rocket Expenditure 1</legend>
    <label for="sub1">
      <b>Sub Total 1:</b>
      <input type="number" id="sub1" name="sub1" value="0">
    </label>&nbsp;&nbsp;&nbsp;+&nbsp;&nbsp;&nbsp;
    <label for="rocket1">
      <b>Rocket 1:</b>
      <input type="number" id="rocket1" name="rocket1" value="0">
    </label>
    <label>
      <b>Total 1:</b>
      <output id="total1" name="total1" for="sub1 rocket1">0</output>
    </label>
  </fieldset>
</form>