如何獲取用戶的輸入並將其存儲以在 Javascript function 中使用？

Question

絕對初學者並嘗試創建一個非常簡單的十進制到二進制轉換器。 我知道 Javascript 中內置了更簡單/更清潔的方法，用於轉換為不同的數字基數，但我喜歡從頭開始創建自己的腳本。 這是代碼：

<!DOCTYPE html>
<html>
<head>
  <title>GetBit</title>
</head>
<body>

  <h1>Decimal to Binary</h1>
    <p><input type="number" min="0" id="decimal"</p>
    <button type="button" onclick="getBit()">Submit</button>
    <p>here is your answer:</p><p id="binary"></p>


<script>
function getBit() {
  var n = document.getElementById("decimal").value;
  if (n >= 2) {
    bit = (n % 2) + "" + bit;
    return getBit(n = Math.floor(n/2), bit)
  } else {
    bit = 1 + "" + bit;
    return bit
  }
  var bit = document.getElementById("binary").innerHTML;
}


</script>
</body>
</html>

我確信這是一個殘暴的代碼，但我正在做試驗。 真的，總的來說，我想更好地理解用戶輸入和 Javascript 函數如何交互，以及將用戶輸入放入變量然后使用這些值到 output 一個新值的最佳實踐（比如取十進制數並輸出二進制） .

我在控制台中測試了我的 getBit() function，它返回了正確的二進制文件。 我為我的 HTML 稍微改變了它。 這是有效的原始JS：

function getBit(n, bit = "") {
  if (n >= 2) {
    bit = (n % 2) + "" + bit;
    return getBit(n = Math.floor(n/2), bit)
  } else {
    bit = 1 + "" + bit;
    return bit
  }
}

我對如何將其轉換為 HTML 中的元素感到困惑。 任何幫助表示贊賞。

Answer 1

你需要改變你的表情：

document.getElementById("binary").innerHTML = bit

您的原始表達式會將所選 DOM 元素的當前 HTML 內容分配給您的變量bit 。

 document.querySelector('#decimal').addEventListener('input',function(ev){ document.getElementById("binary").innerHTML=getBit(ev.target.value)}); function getBit(n, bit="") { if (n >= 2) { bit = (n % 2) + "" + bit; return getBit(n = Math.floor(n/2), bit) } else { bit = +n + "" + bit; return bit } }

 <h1>Decimal to Binary</h1> <p><input type="number" min="0" id="decimal" placeholder="enter a decimal number"> <p>in binary this is:</p> <p id="binary"></p>

我現在將事件偵聽器更改為查找input事件，並將else條件中的語句更改為bit = +n + "" + bit; 否則十進制0將被“轉換”為1 。

如何獲取用戶的輸入並將其存儲以在 Javascript function 中使用？

問題描述

1 個解決方案

解決方案1
1 2019-10-26 20:11:58

如何獲取用戶的輸入並將其存儲以在 Javascript function 中使用？

問題描述

1 個解決方案

解決方案1 1 2019-10-26 20:11:58

解決方案1
1 2019-10-26 20:11:58