Question

我的代码根本不起作用，我不知道为什么。我希望这个程序非常简单 - 我点击<a>标签，其中包含一些特定的href，并根据此href值声音进行播放。< / p>

HTML看起来像这样：

<html>
<head>
    <title>Test</title>
    <meta charset="windows-1250">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

</head>
<body>

    <a href="#00"><div class="box">00</div></a>
    <a href="#01"><div class="box">01</div></a>
    <a href="#02"><div class="box">02</div></a>
    <a href="#03"><div class="box">03</div></a>
    <a href="#04"><div class="box">04</div></a>
    <a href="#05"><div class="box">05</div></a>

    <script src="javs.js" type="text/javascript"></script>
      </body>
</html>

javascript看起来像这样

var hrefsound = "";
$(".box").click(function () {
var bhref = $(this).attr("href");
console.log(bhref);
switch (bhref) {
case "#00":
hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-      content/uploads/2017/01/seno_02_doprdele_prace.mp3");
    hrefsound.play();
    break;
case "#01":
    hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_03_coura.mp3");
    hrefsound.play();
    break;
case "#02":
    hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_04_hajzle.mp3");
    hrefsound.play();
    break;
case "#03":
   hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_05_smejd.mp3");
    hrefsound.play();
    break;
case "#04":
    hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_06_dobytku.mp3");
    hrefsound.play();
    break;
case "#05":
    hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_07_se_pobleju.mp3");
    hrefsound.play();
    break;

}
});

我正在使用jquery，这应该是这样的。我还在那里添加了一些 console.log ，并且href的设置为未定义 - 有谁知道为什么？： - （

感谢您的帮助:-)

Answer 1

您正在处理div元素的点击，并尝试使用包含它们的href元素中的a属性。但是，它实际上是在尝试获取被点击的href的{{1}}属性。当然，div个元素，不具有div属性，这就是您获得href的原因。

更改代码以将点击处理程序附加到undefined元素：

当然，该选择器会选择所有$("a[href]").click(function () {元素，因此您可以为这些元素创建一个类：

<a>

除非您使用这些$(".sound").click(function () {元素执行其他操作，否则根本不需要它们。

这是工作代码：

＆＃13;

div

＆＃13;

var hrefsound = "";
// You want the sounds to play based on the href of the <a> that was clicked
// so set up the click event handler on the <a> - The <div> elements are not required.
$(".sound").click(function () {
  var bhref = $(this).attr("href");
  console.log(bhref);
  switch (bhref) {
    case "#00":
      hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_02_doprdele_prace.mp3");
      hrefsound.play();
      break;
    case "#01":
      hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_03_coura.mp3");
      hrefsound.play();
      break;
    case "#02":
      hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_04_hajzle.mp3");
      hrefsound.play();
      break;
    case "#03":
      hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_05_smejd.mp3");
      hrefsound.play();
      break;
  case "#04":
        hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_06_dobytku.mp3");
      hrefsound.play();
      break;
    case "#05":
      hrefsound = new Audio("http://www.jaroslavhuss.cz/wp-content/uploads/2017/01/seno_07_se_pobleju.mp3");
      hrefsound.play();
      break;
  }
});

＆＃13;

获取href并播放声音 - javascript

1 个答案: