如何从播放列表下载音频文件？

Question

我有一个音频文件的播放列表，左边有一个播放按钮，右边有一个下载按钮。当您按下下载按钮时，它只会播放音频文件，而不会下载文件。为什么不下载文件？

这是带有下载按钮的音频播放列表（为简单起见，仅显示1个音频文件）：

                   <ol class="playlist">
                       <li>
                          <div class="as-link" data-src="/mp3/Ethereum.wav">
                             <!--Row-->
                             <div class="row">
                                <div class="col-lg-6 col-md-6 ">
                                   <div class="block-track">
                                      <h6 class="mb-0 opc-70 uppercase">Ethereum</h6>
                                      <span>Steffi Blümchen </span>
                                   </div>
                                </div>
                                <div class="col-lg-6 col-md-6 text-md-right">
                                   <a href="/mp3/Ethereum.wav" download="true" class="btn-s uppercase btn btn-primary with-ico" ><i class="icon-download"></i>Download</a>
                                </div>
                             </div>
                          </div>
                       </li>

                   </ol>

Answer 1

如果您准备使用javascript，则可以尝试以下代码。

您的html

<ol class="playlist">
                       <li>
                          <div class="as-link" data-src="/mp3/Ethereum.wav">
                             <!--Row-->
                             <div class="row">
                                <div class="col-lg-6 col-md-6 ">
                                   <div class="block-track">
                                      <h6 class="mb-0 opc-70 uppercase">Ethereum</h6>
                                      <span>Steffi Blümchen </span>
                                   </div>
                                </div>
                                <div class="col-lg-6 col-md-6 text-md-right">
                                   <a href="#" onclick="download('/mp3/Ethereum.wav')" download="true" class="btn-s uppercase btn btn-primary with-ico" ><i class="icon-download"></i>Download</a>
                                </div>
                             </div>
                          </div>
                       </li>

                   </ol>

下载脚本

<script>
function download( filename) {
  var a = document.createElement("a");
  a.href = filename;
  a.setAttribute("download", filename);
  var b = document.createEvent("MouseEvents");
  b.initEvent("click", false, true);
  a.dispatchEvent(b);
  return false;
}

download("a.mp3");
</script>