使用 jQuery 在按钮单击上添加声音
Posted
技术标签:
【中文标题】使用 jQuery 在按钮单击上添加声音【英文标题】：Adding Sound on Button Click Using jQuery 【发布时间】：2016-08-03 15:56:18 【问题描述】：所以我在基于文本的冒险中有一个场景，我试图在做出某个玩家选择时添加声音效果，但我无法添加它。
<html>
<div id="s1">
<div class="sit_2">
You stumble upon a dark cave. Do you go inside or not?
</div>
<div class="sit_3a">
A hungry bear comes and kills you.
</div>
</div>
<div id="q1">
<input type="button" class="choice_2a" value="Go inside">
<input type="button" class="choice_2b" value="Don't go inside">
</div>
<audio id="bear" preload="auto" src ="audio/bear.mp3"></audio>
</html>
<javascript type="text/javascript">
$(document).ready(function()
$(".choice_2a").click(function()
$(".sit_2, .choice_2a, .choice_2b").hide();
$("#cave").fadeOut(3000);
$(".sit_3a").fadeIn(3000);
$("#bear").play();
);
)
</javascript>
所以我要做的是在使用 jQuery 选择 .choice_2a 时播放#bear。
【问题讨论】：
<javascript> 应该是 <script type="text/javascript">。还要确保包含 jQuery 库
我希望这不是您的完整 HTML。你需要一个 doctype、一个 head 和 body 元素。 script 标签而不是 javascript，应该在 html 标签内。
@BramVanroy 感谢您的帮助，不，这不是我的全部 html，我错误地遗漏了这些元素。我确实拥有所有这些，并且代码确实可以正常工作，尽管我的音乐没有播放。
【参考方案1】：
没有<javascript> 标签，您需要使用<script> 标签代替。它应该是这样的
<script type="text/javascript">
但更好的是，最好在另一个文件中完全引用 JavaScript，以提供更简洁、更模块化的代码。
另外，请确保您已包含 jQuery。从代码sn-p看，好像没了。
$("button").on("click", function()
$("#my-audio").play()
);
【讨论】：
【参考方案2】：将您的 <javascript> 代码更改为：
<script type="text/javascript">
$(document).ready(function()
$(".choice_2a").click(function()
$(".sit_2, .choice_2a, .choice_2b").hide();
$("#cave").fadeOut(3000);
$(".sit_3a").fadeIn(3000);
$("#bear").play();
);
);
</script>
并确保在 <head> 标记中包含 jQuery 库，例如：<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
【讨论】：
以上是关于使用 jQuery 在按钮单击上添加声音的主要内容，如果未能解决你的问题，请参考以下文章
通过数据表jQuery插件添加的按钮上的jQuery单击事件