Question

所以我在基于文本的冒险中有一个场景，我试图在某个玩家选择时添加声音效果，但是我在添加它时遇到了麻烦。

<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。

Answer 1

没有<javascript>标记，您需要使用<script>标记。看起来应该是这样的

<script type="text/javascript">

但更好的是，最好在另一个文件中引用JavaScript，以提供更清晰，更模块化的代码。

另外，请确保包含jQuery。从代码片段来看，似乎缺失了。

$("button").on("click", function() {
    $("#my-audio").play()
});

Answer 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

2 个答案: