將數據庫值與用戶輸入相乘

Question

我有一個從數據庫中回顯數據的表單，包括三組美元金額。 我還有一個數字輸入框供用戶輸入年數。 我試圖將美元金額乘以用戶投入的年數。我嘗試創建函數但無法使其工作。 有什么建議？ 謝謝

帶有 onchange 事件的用戶輸入，以及從 db 中回顯出的美元金額列表。 （getMoneyValue 是一個格式化美元的函數）。

<dt>Number of Prorated Years:</dt>
            <dd><input type="number" class='form-control' id="proratedYears" name="proratedYears" onchange="multiplyCosts()" min="0" max="20"/></dd>
            <dl>
              <dt>Direct Costs</dt>
              <dd><?php echo $functions->getMoneyValue($recordInfo['directCost']);?></dd>
              <dt>Indirect Costs</dt>
              <dd><?php echo $functions->getMoneyValue($recordInfo['indirectCost']);?></dd>
              <dt>Total Cost</dt>
              <dd><?php echo $functions->getMoneyValue($recordInfo['totalCost']);?></dd>
            </dl>

這是我對 onchange 函數的了解。 我真的不知道如何進行。

 function multiplyCosts() {
  var proYears = document.getElementById("proratedYears").value;
  var adjDirectMulti = ($recordInfo['directCost']);

  var multiTotal = proYears * adjDirectMulti;

}

Answer 1

只需將id賦予<dd>標簽以獲取directCost值，然后使用.value設置文本框的值以顯示 total 。

演示代碼：

 function multiplyCosts() { var proYears = document.getElementById("proratedYears").value; var adjDirectMulti = document.getElementById("directCost").textContent;//get value var multiTotal = proYears * adjDirectMulti; console.log(multiTotal) document.getElementById("totals").value = multiTotal //set value of textbox }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <dt>Number of Prorated Years:</dt> <dd><input type="number" class='form-control' id="proratedYears" name="proratedYears" onchange="multiplyCosts()" min="0" max="20" /></dd> <dl> <dt>Direct Costs</dt> <!--give id--> <dd id="directCost"> 121 </dd> <dt>Indirect Costs</dt> <dd> 25 </dd> <dt>Total Cost</dt> <dd> 145 </dd> </dl> <!--give id--> <input type="text" readonly id="totals">