Question

编辑了我的代码，对不起！

我使用HTML，CSS和Javascript制作了一个按钮，我想知道在单击时将其隐藏。

这是HTML，应该在您单击播放时播放音乐。

<audio id="myTune" src="http://www.rachelgallen.com/HappyBirthday.mp3"></audio>

<button type="button" onclick="aud_play_pause()">&#9658</button>

CSS

body { background: black; }
button {
  background: rgba(255,255,255,0.8);
  border: 0;
  padding: 10px 25px;
  border-radius: 10px;
  font-size: 20px;
  font-weight: bold;
  box-shadow: 0 5px gray;
  outline: none;
  cursor: pointer;
  }

button:active {
  background: #DDDDDD;
  color: #222222;
  border-bottom: 0;
  box-shadow: 0 3px #555555;
  margin-top: 2px;
  }

JavaScript

function aud_play_pause() {
  var myAudio = document.getElementById("myTune");
  if (myAudio.paused) {
    myAudio.play();
  } else {
    myAudio.pause();
  }
}

Answer 1

只需使用按钮元素的隐藏属性即可。

工作示例：

<button onclick="hello(this)">
  Hey
</button>

<script>
  const hello = (element) => {
    element.hidden = true;
  }
</script>

只是为了澄清我在这里所做的工作，我将对元素（this）的引用作为参数传递给单击时触发的函数。调用该函数时，它将引用读取为element并将属性hidden设置为true，因此浏览器将停止呈现它。

Answer 2

您可以使用样式属性 CSS 1.显示：无 2.可见度：无 Js element.hidden = true;

function hide(){

var button=document.getElementById('hide');
button.style.display="none";

}

button{
display:block;

}

<button id="hide" onClick="hide()">play</button>

Answer 3

尝试一下：这就是在代码中使用它的方式。您需要将引用传递给要隐藏的元素。然后
elem.style.display = 'none' 不确定确切的用例，但这可能是一个开始。

function aud_play_pause(elem) {
  var myAudio = document.getElementById("myTune");
  if (myAudio.paused) {
    myAudio.play();
  } else {
    myAudio.pause();
  }
  elem.style.display = 'none'
}

body { background: black; }
button {
  background: rgba(255,255,255,0.8);
  border: 0;
  padding: 10px 25px;
  border-radius: 10px;
  font-size: 20px;
  font-weight: bold;
  box-shadow: 0 5px gray;
  outline: none;
  cursor: pointer;
  }

button:active {
  background: #DDDDDD;
  color: #222222;
  border-bottom: 0;
  box-shadow: 0 3px #555555;
  margin-top: 2px;
  }

<audio id="myTune" src="http://www.rachelgallen.com/HappyBirthday.mp3"></audio>

<button type="button" onclick="aud_play_pause(this)">&#9658</button>

单击后如何隐藏按钮

3 个答案: