时间戳

首页 > 解决方案 > 如何在 onclick 事件上激活“if”条件

javascript - 如何在 onclick 事件上激活“if”条件

问题描述

我似乎无法弄清楚为什么我的“if”部分函数在 onclick 事件上不起作用。我正在尝试使一个函数在 HTML 中的 onclick 上执行，它会执行它，但结果我总是得到“未定义”......

我的 HTML 是：

<button type="button" id="n1" class="btn btn-secondary btn-decor" onclick="pressNumber()">1</button>
                <button type="button" id="n2" class="btn btn-secondary btn-decor" onclick="pressNumber()">2</button>

和 Javascript


var displayedValue = document.getElementById("calc-disp").textContent;

var fullNumber;

function pressNumber () {
    if (document.getElementById("n1")) {
        var fullNumber = displayedValue + numbers[1];
    }
    else if (document.getElementById("n2")) {
        var fullNumber = displayedValue + numbers[2];
    }
    displayValueNow();
}

// display result

function displayValueNow () {
    document.getElementById("calc-disp").innerHTML = fullNumber;
}```

thanks for any advice

标签： javascriptonclick

解决方案

而不是使用 if 语句，只需将按钮编号作为参数传递给函数并在计算中使用它。

const numbers = [0, 1, 2];

// Cache only the element
const displayedValue = document.getElementById('calc-disp');

function displayValueNow(fullNumber) {
  displayedValue.textContent = fullNumber;
}

function pressNumber(n) {

  // Make sure you coerce your displayed value (a string) to
  // an integer before trying to add it to the number in the array
  var fullNumber = Number(displayedValue.textContent) + numbers[n];

  // Pass in `fullNumber` as an argument to `displayValueNow`
  // so you're not using a global variable
  displayValueNow(fullNumber);
}
<button type="button" onclick="pressNumber(1)">1</button>
<button type="button" onclick="pressNumber(2)">2</button>
<div id="calc-disp"></div>

推荐阅读