为什么Waveurfer.js中的“全部暂停”无效？

如何解决为什么Waveurfer.js中的“全部暂停”无效？

我使用Wafesurfer.js来显示一些音频波。为此，我将实例存储在关联数组中，并建立并添加一个引用每个实例ID的按钮：

function render(id,url) {
  let trackid = "t"+id;
  var domEl = document.createElement('div');
  domEl.setAttribute("id","t-"+id);
  document.body.appendChild(domEl);

  wavesurfer[trackid] = WaveSurfer.create({
        container: domEl,barWidth: 2
      });
  wavesurfer[trackid].drawBuffer();
  wavesurfer[trackid].load(url,false);
}

for(let i=0; i<3; i++) {
  render(id,'path/song.mp3');
  $('.buttons').append('<button onclick="wavesurfer[\'t'+i+'\'].playPause();">Play</button>');
}

因此，此示例可以正常工作，并为我提供了三个播放器和三个按钮来控制每个播放器。但是现在我想每当单击一个按钮时暂停所有玩家。这就是为什么我将按钮功能更改为“ PlayPause”的功能：

$('.buttons').append('<button onclick="wsPlayPause(\'t'+i+'\')";>Play</button>');

只要我在其中使用PlayPause，此功能就可以正常工作

function wsPlayPause(id) {
    wavesurfer[id].playPause();
}

但是，如果我想在启动所选对象之前向所有实例添加.pause（），将无法正常工作：

function wsPlayPause(id) {
    console.log(wavesurfer);      // output: [t0: t,t1: t,t2: t]
    for (key in wavesurfer) {
        wavesurfer[key].pause(); // this gives the Error: 
    }                            // "TypeError: wavesurfer[key].pause is not a function
    
    // wavesurfer['t0'].pause(); // this also works if i write it manually 
    wavesurfer[id].playPause();  // this works fine
}

所以我的问题是：为什么暂停不起作用？