Javascript HTML音频，不带文本单击暂停控件

你好，stackovercool社区

我试图在我的网站上设置一个声音播放器，并在页脚中显示曲目的标题。到目前为止还不错，但我想在点击文本标题时将音乐静音。我还希望在暂停时更改文本的不透明度

很抱歉，我的JS知识确实缺乏知识。我在做了各种研究之后试过了，但都不管用

function play(idPlayer) {
    var player = document.querySelector('#' + idPlayer);

    if (player.played) {
        player.pause();
        player.style.opacity = "0.5";
    } else {
        player.play();
        player.style.opacity = "1";
    }
}

它主要是基于这个图茨

我事先非常感谢你的帮助

如果有人想要类似的东西，这里有一个有效的答案

但是我的wordpress仍然不起作用，我想是因为

var $j = jQuery.noConflict(); $j(document).ready(function()

---

我想问题解决了。

小提琴不会停下来的原因是你选择了“onDomReady”选项，而你本应该选择“No Wrap-in head”选项。这样做的效果是将所有js代码放在响应文档加载而激发的函数中。这意味着，当单击html时，它无法“找到”您编写的

play

函数，因为它不是全局名称空间的一部分，而是隐藏在加载小提琴时触发的（添加了JSFIDLE的）函数中。这会让你走上一段路。其余部分使用AudioContext上的调试器和MDN帮助。；）我明白了，有趣的“概念”，我应该进一步挖掘，谢谢你的解释。我花了一个多小时没有任何具体结果，但这可能会让我有所收获，最终我的wordpress上也出现了同样的情况，我在一个自定义字段中输入了JS，Firebug告诉我play没有定义。我认为这可能与声明函数播放（audioPlayer）{var player=document.querySelector（'#audioPlayer'）有关，而不是函数播放（idPlayer）{var player=document.querySelector（'#'+idPlayer）；但不起作用。@enhzflep在这把小提琴中，代码只用于暂停，而不用于回放或修改不透明度。在我的网站上，它根本不起作用，在编辑器中，我看到自定义JS在末尾输出，但其中有默认代码，我猜，这会导致函数失效，因为它与您向我解释的内容相关。

var$j=jQuery.noConflict（）；$j（document）.ready（function（）{“使用严格”；window.onready=function play（idPlayer）{var player=document.querySelector（'#'+idPlayer）；if（player.player）{player.pause（）；player.style.opacity=“0.5”}else{player.play（）；player.style.opacity=“1”}）；

我尝试添加

window.onready=function（）

但没有成功