需要帮助创建计算 ROI 的有效 HTML 表格

Question

我正在尝试创建一个 HTML 表单，用户在输入框中输入预期收益和成本，单击计算，该表单应计算并显示净利润和投资回报率。

到目前为止，表格让我可以输入预期收益和成本，但计算按钮没有在相应的框中显示净利润和投资回报率。

这是我到目前为止所拥有的（仅包括相关部分）：

 // Declare variables var projectName; // Gets user input for project name var expectedCost; // Gets user input for cost of project var expectedGain; // Gets user input for expected gain var netProfit; var returnOnInvestment; function calcNetProfit() { netProfit = expectedGain - expectedCost; // Calculate net profit } function calcReturnOnInvestment() { returnOnInvestment = netProfit / expectedCost * 100; // Calculate Return on Investment }

 <form> <label>Project Name</label> <input> <br><br> <label>Cost</label> <input> <br><br> <label>Gain</label> <input> <br><br> <label>Net Profit</label> <input> <br><br> <label>ROI as percentage</label> <input> <br><br> <input type="button" name="calculate" value="Calculate" onclick="calcNetProfit(); calcReturnOnInvestment();"/><br /> </form>

Answer 1

尝试使用document.getElementById("demo").value获取输入类型的值，您还可以使用同一行代码操作输入框：

 function calc() { var projectName = document.getElementById("name").value var expectedCost = document.getElementById("cost").value var expectedGain = document.getElementById("gain").value var netProfit = expectedGain - expectedCost; document.getElementById("netprofit").value = netProfit; var returnOnInvestment = netProfit / expectedCost * 100; document.getElementById("roi").value = returnOnInvestment; }

 <form> <label>Project Name</label> <input type="text" id="name"> <br><br> <label>Cost</label> <input type="text" id="cost"> <br><br> <label>Gain</label> <input type="text"id="gain"> <br><br> <label>Net Profit</label> <input type="text" id="netprofit"> <br><br> <label>ROI as percentage</label> <input type="text" id="roi"> <br><br> <input type="button" name="calculate" value="Calculate" onclick="calc();"/><br /> </form>

Answer 2

要获得输入值，您必须使用

 var projectname =  document.querySelector('//id 
or class of input id 
mustbe #idname and class .classname').value;

然后使用 thouse 值进行操作

还输入标签必须具有类型和 class 或 id

<input type="number" class="classname">

Answer 3

您缺少有关如何获取收益、成本和净利润值的步骤。 阅读 JavaScript DOM。

简而言之，这是答案。

 function calcNetProfit() { var expectedGain = document.getElementById('gain').value; var expectedCost = document.getElementById('cost').value; var netProfit = expectedGain - expectedCost; document.getElementById('netprofit').value = netProfit; return netProfit; } function calcReturnOnInvestment() { var expectedCost = document.getElementById('cost').value; var netProfit = calcNetProfit(); var roi = netProfit / expectedCost * 100; // Calculate Return on Investment document.getElementById('roi').value = roi; }

 <html> <form> <label>Project Name</label> <input> <br><br> <label>Cost</label> <input id="cost"> <br><br> <label>Gain</label> <input id="gain"> <br><br> <label>Net Profit</label> <input id="netprofit"> <br><br> <label>ROI as percentage</label> <input id="roi"> <br><br> <input type="button" name="calculate" value="Calculate" onclick="calcNetProfit(); calcReturnOnInvestment();" /><br /> </form> </html>

需要帮助创建计算 ROI 的有效 HTML 表格

问题描述

3 个解决方案

解决方案1
1 2019-10-13 23:14:31

解决方案2
0 2019-10-13 22:57:18

解决方案3
0 已采纳 2019-10-13 22:58:18

需要帮助创建计算 ROI 的有效 HTML 表格

问题描述

3 个解决方案

解决方案1 1 2019-10-13 23:14:31

解决方案2 0 2019-10-13 22:57:18

解决方案3 0 已采纳 2019-10-13 22:58:18

解决方案1
1 2019-10-13 23:14:31

解决方案2
0 2019-10-13 22:57:18

解决方案3
0 已采纳 2019-10-13 22:58:18