Question

我的JavaScript代码必须上下移动 div 。当我点击它时我希望它上升，然后当我第二次点击时我希望它下降。我的代码是这样的：

function why()
{
    if (document.getElementById("newton").style.bottom == 23) {
        alert("I entered the IF");
        document.getElementById("newton").style.bottom = 0;
    }
    else {
        alert("I entered the ELSE");
        document.getElementById("newton").style.bottom = 23;
    }
}

奇怪的是，我第一次单击它上升并告诉我ELSE部分已执行，但在此之后，单击它不会产生任何效果，它不会再回落。这是为什么？

Answer 1

您需要指定一个单位，例如%或px或其他。

function why() {

  if (document.getElementById("newton").style.bottom == '23px') {
    alert("I entered the IF");
    document.getElementById("newton").style.bottom = 0;
  } else {
    alert("I entered the ELSE");
    document.getElementById("newton").style.bottom = '23px';
  };
}

<button id="newton" onclick="why()">click</button>

但我会切换一个类，并将此更改放入CSS中。

function why(el) {
  el.classList.toggle('up');
}

#newton {
  bottom: 0;
}
#newton.up {
  bottom: 23px;
}

<button id="newton" onclick="why(this)">click</button>

Answer 2

我发现如果其他js函数错误，它会影响我的整个代码，甚至其他函数。代码是正确的，但由于另一个函数错误导致我的代码无效...感谢toogle的类建议，我将实现它;）

如果不是，Javascript也不会触发

2 个答案: