我需要一个按钮不消失

Question

我正在制作一个带有按钮的 javascript 代码，当我点击它时，它显示 5 个符号之一，但是当我点击按钮时，它显示随机符号，但按钮消失了。我是 javascript 的新手，请问可以得到一些帮助吗？

<script>

function slots()
{
    var slot1 = Math.floor(Math.random()*5);
    if (slot1 == 0) {
        document.write("\u2663");
    }
    if (slot1 == 1) {
        document.write("\u2665");
    }
    if (slot1 == 2) {
        document.write("\u2666");
    }
    if (slot1 == 3) {
        document.write("\u2660");
    }
    if (slot1 == 4) {
        document.write("7");
    }
}

</script>
<button type="button" value="Spin" name="SPIN"onClick="slots(); return false;"></button>

Answer 1

当你写 document.write() 时屏幕会刷新，所以我想你可以这样做：

<script>

function slots()
{
    var slot1 = Math.floor(Math.random()*5);
    if (slot1 == 0) {
        document.getElementById('value').innerHTML = "\u2663";
    }
    if (slot1 == 1) {
        document.getElementById('value').innerHTML = "\u2665";
    }
    if (slot1 == 2) {
        document.getElementById('value').innerHTML = "\u2666";
    }
    if (slot1 == 3) {
        document.getElementById('value').innerHTML = "\u2660";
    }
    if (slot1 == 4) {
        document.getElementById('value').innerHTML = "7";
    }

}
</script>

<button type="button" value="Spin" name="SPIN" onClick="slots();">Click</button>
<span id="value"></span>

Answer 2

otrebla 代码的略微优化版本，查看实际效果：

function slots() {
  var slot1 = Math.floor(Math.random() * 5);
  var value = document.getElementById('value');
  switch (slot1) {
    case 0:
      value.innerHTML = "\u2663";
      break;
    case 1:
      value.innerHTML = "\u2665";
      break;
    case 2:
      value.innerHTML = "\u2666";
      break;
    case 3:
      value.innerHTML = "\u2660";
      break;
    case 4:
      value.innerHTML = "7";
      break;
  }
}

<button type="button" value="Spin" name="SPIN" onClick="slots();">Click</button>
<span id="value"></span>

我需要一个按钮不消失

I need a button NOT to disapear

javascript

random

button