如何將輸入與 a 和 b 連接？

Question

如何連接 a 和連接 b？

例如，如果用戶鍵入第一個輸入，a 將與第一個輸入具有相同的值。

當用戶輸入第二個輸入時，b 將與第二個輸入的值相同。

<!DOCTYPE html>
<html>
<body>



<input id="Number1" type="number">
+
<input id="Number2" type="number">
= 

<p id="demo"></p>

<script>
let a = 2;
let b = 3;
let c = a + b;
document.getElementById("demo").innerHTML = c;
</script>

</body>
</html>

Answer 1

您可能需要一些可以執行某些代碼以響應特定事件的事件處理程序。 你可以有一個按鈕來計算和輸出答案：

<input id="Number1" type="number" />
+
<input id="Number2" type="number" />
=
<p id="demo"></p>
<button id="calculate">Calculate</button>

<script>
  function handleClick() {
    const num1 = document.getElementById("Number1").value;
    const num2 = document.getElementById("Number2").value;
    const answer = num1 + num2;
    document.getElementById("demo").innerHTML = answer;
  }

  document.getElementById("calculate").addEventListener("click", handleClick);
</script>

或者您可以添加事件偵聽器以在輸入值更改時運行。

<input id="Number1" type="number" value="0" />
+
<input id="Number2" type="number" value="0" />
=
<p id="demo"></p>

<script>
  function handleChange() {
    const num1 = document.getElementById("Number1").value;
    const num2 = document.getElementById("Number2").value;
    const answer = num1 + num2;
    document.getElementById("demo").innerHTML = answer;
  }

  document.getElementById("Number1").addEventListener("change", handleChange);
  document.getElementById("Number2").addEventListener("change", handleChange);
</script>

這些都是非常簡單（並且有些幼稚）的實現。 對於更高級的應用程序，您可能希望使用一些框架（例如 React）。

如何將輸入與 a 和 b 連接？

問題描述

1 個解決方案

解決方案1
1 已采納 2022-12-06 08:26:49

如何將輸入與 a 和 b 連接？

問題描述

1 個解決方案

解決方案1 1 已采納 2022-12-06 08:26:49

解決方案1
1 已采納 2022-12-06 08:26:49