Question

因此，我有这段代码基本上可以执行简单的数学功能，但是现在我不知道如何将<input>和<output>标签与JavaScript链接在一起，以便用户在{ {1}}运行脚本，结果显示在<input>中感谢您的任何帮助，请在我还在学习的过程中提供帮助。

<output>

function computation(number) { 
  let newNumber = number + (1/100 * number) + 1000;
  let roundedNumber = Math.round(newNumber/100)*100;
  return roundedNumber;
}

Answer 1

首先要使用数字作为函数的参数，但是调用函数时函数没有得到它。因此可以使用

document.getElementById('id').value

获取值。看看这个。

function computation() { 
  let number = document.getElementById('input1').value;
  let newNumber = number + (1/100 * number) + 1000;
  let roundedNumber = Math.round(newNumber/100) * 100;
  document.getElementById('output1').innerHTML = roundedNumber;
}

<p>Enter Amount Here:</p><br>
<input type="text" name="value1" id="input1">
<button class="button" onClick="computation()">Calculate!</button>
<p>Final Amount</p>
<div class="output">
<output for="roundedNumber" name="finalAmount" id="output1"></output>
</div>

Answer 2

遵循以下简单步骤。 1）将id添加到您的输入和输出标签中，只需与name相同

<input type="text" name="value" id="value" />
<output for="roundedNumber" name="finalAmount" id="finalAmount"/>

2）使用js document.getElementById("inputid").value

let num = document.getElementById("value").value

3）使用相同的方式设置值。假设您要在段落标记中显示它。

<p id="output"></p>
document.getElementById("output").innerHTML =newNum;

4）对于活动标签，请在.value的{{1}}瞬间使用

用JavaScript函数链接html <input />和<output>

2 个答案: