html - 在同一页面后台播放音频

Question

我们正在开发一个应用程序来管理基于 IP 网络扬声器的商店中的声音(紧急情况、促销、播放列表...)。

目前，我们无法通过单击网页上的“播放”按钮找到在 IP x.x.x.x 的扬声器上播放声音的解决方案。

以下设置有效(播放声音)，但它总是在我们的浏览器中打开一个新选项卡。我们希望以“隐藏”方式播放声音(不打开单独的选项卡/窗口/其他)，而是在现有页面的背景中播放。这同样适用于我们的“停止”按钮(这也会在单独的选项卡中打开)

这是我们正在使用的 html 代码(我删除了所有图标等...)

---

<tr>
    <td>Fire evacuation</td>
    <td><div class= "tag-emergency"><i class="fas fa-fire"></i> Emergency</div></td>
    <td><a href="http://x.x.x.x/axis-cgi/playclip.cgi?clip=3" class="w3-bar-item w3-button w3-padding play"><i class="fas fa-play fa-fw"></i></a></td>
    <td><a href="http://x.x.x.x/axis-cgi/mediaclip.cgi?action=stop" class="w3-bar-item w3-button w3-padding stop"><i class="fas fa-stop fa-fw"></i></a></td>
  </tr>

有人知道怎么做吗？

谢谢!

妮可

Answer 1

如果我没理解错的话，你可以用 AJAX 做到这一点。一个按钮应该看起来像这样:

document.getElementById("yourButtonClass").onclick = function(e) {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
     var response = xmlhttp.responseText;
    }
  }

  xmlhttp.open("GET","http://x.x.x.x/axis-cgi/playclip.cgi?clip=3",true);
  xmlhttp.send();
};

和 HTML:

 <td><a class="w3-bar-item w3-button w3-padding play yourButtonClass"><i class="fas fa-play fa-fw"></i></a></td>