切换按钮，但只切换一次

Question

我有一个很好的音频播放按钮代码。单击后它变成一个暂停按钮。很好，但我想保留一个暂停按钮。所以它应该只切换一次。最好添加一些代码，而不是用全新的代码替换。代码：

<script>
function a(el){
play()
}

function b(el){
pause()
}

$(".btn-play").click(function() {
  var el = this;
  return (el.t = !el.t) ? a(el) : b(el);
 }); 
</script>

Answer 1

这个怎么样：https://jsfiddle.net/e0evwnvu/

$(document).ready(function() {
  var isPauseButton = false;
  $('#btn').click(function() {
    if (!isPauseButton) {
        play();
      isPauseButton = true;
    } else {
        pause();
    }
  });
});

function play() {
    alert('play');
}

function pause() {
    alert('pause');
}

Answer 2

假设el.t == false表示b()，只需添加一个预检查：

$(".btn-play").click(function() {
  var el = this;
  if (!el.t) b(el);
  return (el.t = !el.t) ? a(el) : b(el);
});

如果你想成为另一个，那么使用if (el.t) b(el);

就个人而言，我会简化代码：

$(".btn-play").click(function() {
  var el = this;
  if (!el.t) b(el);
  el.t = false;
  a(el);
});

Answer 3

这是对 "I want to use the button only once" 的一个相当笼统的回答，因为问题中没有给出太多细节。

您可以使用 $('.btn-play').attr("disabled", true) 或 $(".btn-play").unbind("click") 禁用该按钮 - 只要确保它只选择您想要的按钮。

如果您希望按钮具有不同的功能（暂停而不是播放或其他）我建议单独定义处理程序，这样您可以使用 .unbind("click", handler1) 后跟 .bind("click", handler2) 或其他一些保持两个处理程序分开的方法，as per documentation here.

切换按钮，但只切换一次

toggle button, but toggle only once

javascript

jquery

toggle