Tone.js 的条件复选框操作（网络音频）

Question

我正在尝试使用 Tone.js 创建一个复选框 ($('#button'))，其操作会根据 player 的状态（无论是否正在播放音频）而变化和 jQuery.

因此，逻辑是如果音频已经是 started，那么复选框的操作只是 mute（或取消静音）音频。但是，如果音频不是已经 started 那么我希望复选框为 start player（默认为 player.mute == false）并且将自己的操作更改为 mute/unmuting。这将意味着，一旦 player.state == started 您无法更改它，只能切换它是否为 muted。

我已经设法得到一个函数，可以切换 state 或 mute 值，但不是复选框的操作本身是由 state 决定的。下面的代码是我对此的尝试，但它似乎不起作用 ☹️ – 非常感谢任何帮助。

  const button = $('#button');

  if(player.state == 'started') {
    $(button).attr('checked', true);
  } else if(player.state == 'stopped') {
    $(button).attr('checked', false);
  }

  if(player.state == 'started') {
    $(button).change(function(){
        if(player.mute == true) {
          player.mute == false;
          $(this).attr('checked', true);
        } else if(player.mute == false) {
          player.mute == true;
          $(this).attr('checked', false);
        }
      });
  } else if(player.state == 'stopped') {
    $(button).change(function(){
      player.start();
      $(this).attr('checked', true);
    });
  }

仅供参考：这都是因为是否允许自动播放因浏览器而异。在脚本前面的一些自动播放功能中，player 在页面加载时开始 ()，在其他情况下，需要明确的用户操作 ()。

Answer 1

我的理解是，所需的行为如下：-

每当 player.state === 'started' 单击该按钮应使音频静音，再次单击它应取消静音。并继续切换直到 player.state === 'started' 如果 player.state === 'stopped'，点击按钮应该启动音频，然后继续切换 mute/unmute 直到播放器处于启动状态。

下面是相同的实现。常量按钮 = $('#button');

//First set the button state to checked on unchecked depending on state
if(player.state == 'started') {
  button.attr('checked', true); //this means now the player is playing musing and is unmute.
} else if(player.state == 'stopped') {
    button.attr('checked', false); //this means now the player is stopped and is also mute
}

button.change(function(){
  if(player.state === 'started') {
    if(player.mute) {
      player.mute = false;
      button.attr('checked', false);
    } else {
      player.mute = true;
      $(this).attr('checked', true);
    }
  } else if (player.state === 'stopped') { //button was clicked and player is in stopped state. so start the player and turn on the checkbox so it displays that it is playing and is unmute
    player.start();
    button.attr('checked', true);
  }
});

//在这个实现中，勾选意味着取消静音和启动状态。 //关闭复选框表示已停止或已启动+静音状态。

Tone.js 的条件复选框操作（网络音频）

Conditional checkbox action for Tone.js (Web Audio)

javascript

jquery

dom

tone.js