Javascript 获取要隐藏和填充的表单字段

我有3个字段： 总额 经常性金额 事件

用户将始终输入事件，但可以选择输入总金额或定期金额

这个方程非常简单： 发生次数*经常性金额=总金额

我需要帮助制作一个Javascript函数，如果用户开始在total amount字段中键入，则循环金额将被禁用。如果他们先输入定期金额，情况也是如此。一旦用户输入了事件和任何一个金额，应计算剩余金额并替换禁用字段

我需要的功能，能够允许用户改变任何数字，并有计算重新完成。此外，如果用户从金额中完全删除了一个值，则其他金额字段应再次激活

---

我以前从未编写过Javascript代码，只是编辑过。任何能为我指明正确方向的帮助都将不胜感激。谢谢

我不知道为什么你认为禁用字段是个好主意。我认为在用户体验方面，最好允许他们随时编辑任何字段，并根据需要调整其他字段

<input id="recurring" onchange="onRecurEdit()"> * 
<input id="occurences" onchange="onOccurEdit()"> =
<input id="total" onchange="onTotalEdit()">
<script>      
  var recur = document.getElementById('recurring');
  var total = document.getElementById('total');
  var occur = document.getElementById('occurences');

  function onTotalEdit() {
    recurring.value = total.value / occur.value;
  }

  function onRecurEdit() {
    total.value = occur.value * recur. value;
  }

  function onOccurEdit() {
    total.value = occur.value * recur. value;
  }
</script>

*
=
var recur=document.getElementById（'recurtive'）；
var total=document.getElementById（'total'）；
var-occure=document.getElementById（'occurrences'）；
函数onTotalEdit（）{
recurtive.value=total.value/occurrent.value；
}
函数onRecoredit（）{
total.value=发生.value*重现值；
}
函数onoccurdit（）{
total.value=发生.value*重现值；
}

不确定您为什么认为禁用字段是个好主意。我认为在用户体验方面，最好允许他们随时编辑任何字段，并根据需要调整其他字段

<input id="recurring" onchange="onRecurEdit()"> * 
<input id="occurences" onchange="onOccurEdit()"> =
<input id="total" onchange="onTotalEdit()">
<script>      
  var recur = document.getElementById('recurring');
  var total = document.getElementById('total');
  var occur = document.getElementById('occurences');

  function onTotalEdit() {
    recurring.value = total.value / occur.value;
  }

  function onRecurEdit() {
    total.value = occur.value * recur. value;
  }

  function onOccurEdit() {
    total.value = occur.value * recur. value;
  }
</script>

*
=
var recur=document.getElementById（'recurtive'）；
var total=document.getElementById（'total'）；
var-occure=document.getElementById（'occurrences'）；
函数onTotalEdit（）{
recurtive.value=total.value/occurrent.value；
}
函数onRecoredit（）{
total.value=发生.value*重现值；
}
函数onoccurdit（）{
total.value=发生.value*重现值；
}

这并不完美，但应该是一个不错的开始：

您可以在以下位置查看此代码的交互式演示

您尚未向我们提供您的HTML，因此我假设您正在使用以下内容：

<form action="" method="POST">
  <input type="text" name="occurences" id="occurences" value="" />
  <input type="text" name="recurringAmt" id="recurringAmt" value="" />
  <input type="text" name="totalAmt" id="totalAmt" value="" />
</form>

---

这并不完美，但应该是一个不错的开始：

您可以在以下位置查看此代码的交互式演示

您尚未向我们提供您的HTML，因此我假设您正在使用以下内容：

<form action="" method="POST">
  <input type="text" name="occurences" id="occurences" value="" />
  <input type="text" name="recurringAmt" id="recurringAmt" value="" />
  <input type="text" name="totalAmt" id="totalAmt" value="" />
</form>

---

下面是您可能正在寻找的部分内容：代码使用JQuery

JS代码：

     $(document).ready(function() {

           function roundNumber(num, dec) {
              var result = Math.round(num*Math.pow(10,dec))/Math.pow(10,dec);
              return result;
           }

           function calculateTot(evt) {
              var o = Number($("#occur").val());
              var a = Number($("#recAmt").val());

              if(!isNaN(0) && !isNaN(a)) {
                 var tot = roundNumber(o * a, 2);
                 $("#totalAmt").val(tot);
              }else {
                 $("#totalAmt").val("0");
              }
           }

           $("#occur").bind("change", calculateTot);
           $("#recAmt").bind("change", calculateTot);

     });

相同的HTML：

     <input type="text" id="occur" /> *
     <input type="text" id="recAmt" /> =
     <input type="text" id="totalAmt" readonly="readonly" />

*
=

您可能正在寻找的部分内容是：代码使用JQuery

JS代码：

     $(document).ready(function() {

           function roundNumber(num, dec) {
              var result = Math.round(num*Math.pow(10,dec))/Math.pow(10,dec);
              return result;
           }

           function calculateTot(evt) {
              var o = Number($("#occur").val());
              var a = Number($("#recAmt").val());

              if(!isNaN(0) && !isNaN(a)) {
                 var tot = roundNumber(o * a, 2);
                 $("#totalAmt").val(tot);
              }else {
                 $("#totalAmt").val("0");
              }
           }

           $("#occur").bind("change", calculateTot);
           $("#recAmt").bind("change", calculateTot);

     });

相同的HTML：

     <input type="text" id="occur" /> *
     <input type="text" id="recAmt" /> =
     <input type="text" id="totalAmt" readonly="readonly" />

*
=

也可以。重要的是计算，这也很好。最重要的部分是计算。这非常有效。谢谢你的现场演示。我已将JSFIDLE添加到书签中。这似乎很好用。谢谢你的现场演示。我已将JSFIDLE添加到书签中。似乎很方便