如何检索表单值，对其执行操作并在a中显示 <p> 标签？

Question

我想从表单控件类型=“数字”中获取一个数字，比较它，然后如果条件正常，则执行乘法和除法。 之后我想将结果显示为<p>标签的内容。 怎么做到这一点？

这是我到目前为止所尝试的：

 let amount = document.getElementById(".amount"); let marginAmount = document.getElementById(".marginAmount") let submit = document.getElementById(".submit"); submit.addEventListener('click', calcAmount); const calcLevel1 = amount * 7 / 100; function calcAmount() { let userAmount = Number(amount.value); let level1 = 351; if (userAmount <= level1) { marginAmount.textContent = calcLevel1.value; } }

 <div class="form"> <label for="points amount">Entrez un montant en points</label> <input type="number" class="amount-enter" id="amount"> <input type="submit" value="Montant marge additionnelle" id="submit" class="submit-enter"> </div> <p id="marginAmount" class="enter-margin"></p>

Answer 1

这是纠正的代码，有。 哪些是要删除我还添加了math.round以获得舍入结果：

 <html> <head> <script> function calcAmount() { let userAmount = document.getElementById("amount").value; let level1 = 351; if (userAmount <= level1) { document.getElementById("marginAmount").textContent = Math.round(userAmount * 7) / 100; } else { document.getElementById("marginAmount").textContent = "Amount is > 351"; } } </script> </head> <body> <div class="form"> <label for="points amount">Entrez un montant en points</label> <input type="number" class="amount-enter" id="amount"> <input type="submit" value="Montant marge additionnelle" id="submit" class="submit-enter" onclick="calcAmount()"> </div> <p id="marginAmount" class="enter-margin"></p> </body>

Answer 2

三件事：

你有. 在你的ID选择器中，这些不应该存在（它们应该是#但只能在querySelector方法中）。
你是直接计算calcLevel1 ，这意味着它是0 * 7 / 100 calcLevel1 ，即0 。
您需要使用amount.value计算calcLevel1 ，这意味着您可以在设置段落的textContent时删除calcLevel1.value 。

我还添加了一个else语句，以便在语句为false时清空textContent 。

 let amount = document.getElementById("amount"); let marginAmount = document.getElementById("marginAmount") let submit = document.getElementById("submit"); submit.addEventListener('click', calcAmount); function calcAmount() { const calcLevel1 = amount.value * 7 / 100; let userAmount = Number(amount.value); let level1 = 351; if (userAmount <= level1) { marginAmount.textContent = calcLevel1; } else { marginAmount.textConten = ""; } }

 <div class="form"> <label for="points amount">Entrez un montant en points</label> <input type="number" class="amount-enter" id="amount"> <input type="submit" value="Montant marge additionnelle" id="submit" class="submit-enter"> </div> <p id="marginAmount" class="enter-margin"></p>

如何检索表单值，对其执行操作并在a中显示 <p> 标签？

问题描述

2 个解决方案

解决方案1
2 已采纳 2019-04-19 09:13:28

解决方案2
1 2019-04-19 08:41:25

如何检索表单值，对其执行操作并在a中显示 <p> 标签？

问题描述

2 个解决方案

解决方案1 2 已采纳 2019-04-19 09:13:28

解决方案2 1 2019-04-19 08:41:25

解决方案1
2 已采纳 2019-04-19 09:13:28

解决方案2
1 2019-04-19 08:41:25