Question

我正在使用html5中的音频相关文件。

我使用以下功能来改变音频

function Audioplay(id) {
    var id=id.split('Symbols')[1];
    var FolderRedirect=id.split('')[0];

    $("#audio").get(0).pause();
    $("#audio").attr('src',  ' ');
    $("#audio").attr('src', 'assets/audio/'+Folder[FolderRedirect]+'/sound_'+id+'.mp3');
    $("#audio").get(0).play();
};

它会改变音频，但会在第一次完全播放。我怎样才能立即播放onclick？感谢

Answer 1

如果您查看自己的功能，则会将play()作为最后一行。删除它，而不是将其作为单击处理程序添加到您用作控件的任何元素上。

您还应该考虑其他清理工作：

函数名称通常以小写字母开头 - 以大写字母开头的函数暗示您应该使用new运算符创建一个。
您将id重新声明为局部变量，即使它作为参数传入。
您可以在函数体内引用变量Folder。这使得很难推断出那里发生的事情。考虑将folder数组（注意正确的情况）作为参数传递给函数，或者甚至更好，将重定向的派生分离为单独的函数。
您强制jQuery查找#audio元素4次。相反，将它存储在局部变量中，因此jQuery只需要查找一次。

重新设计的功能：

function playAudio($audio) {
  $audio.get(0).play();
}

function normalizeId(rawId) {
  var idParts = id.split('Symbols');
  return idParts[1];
}

function getFolderRedirectFromNormalizedId(normalizedId) {
  return normalizedId.split('')[0];
}

function getSourcePathFromId(id) {
  var folders, folderRedirect, normalizedId;
  folders = [/* Initialize your folder array */];

  normalizedId = normalizeId(id);

  folderRedirect = getFolderRedirectFromNormalizedId(normalizedId);

  return 'assets/audio/' + folders[folderRedirect] + '/sound_' + normalizedId + '.mp3';
}

function initializeAudio(id) {
  var src, $audio;
  $audio = $("#audio");
  $audio.get(0).pause();
  $audio.attr('src',  ' ');

  src = getSourcePathFromId(id);
  $audio.attr('src', src);

  $('.control-you-want-to-click').click(function() {
    playAudio($audio);
  });
}

initializeAudio();

音频排队不立即播放

1 个答案: