单击是图像内部时播放音频文件,单击图像外部时播放不同的音频文件

时间:2017-03-17 10:50:20

标签: javascript html image audio onclick

我正在通过做一些自己的小练习来学习HTML-CSS-JS。当我点击图片时,我创建了一个播放mp3音频的小代码:

 <html>
  <head>
    <title>Image audio exercise</title>
  </head>
  <body>
    <script>
      function play(){
         var audio = document.getElementById("audio");
         audio.play();
      }
    </script>
    <img src="img.gif" onclick="play()">
    <audio id="audio" src="sound.mp3" ></audio>
  </body>
 </html> 

我希望能够在点击位于图像之外时播放不同的音频文件。有一个简单的方法吗?也许是if-else声明?

2 个答案:

答案 0 :(得分:2)

你可以这样做。只需一个简单的检查,看看你是否点击了图片或文件。

<html>
  <head>
    <title>Image audio exercise</title>
  </head>
  <body>

    <img id="theImage" src="img.gif">
    <audio id="audio" src="sound.mp3" ></audio>

    <script>
      var audio = document.getElementById("audio");
      var img = document.getElementById("theImage");

      document.addEventListener("click", function(e){
         if( e.target === img ){
           audio.src = "sound.mp3";
           audio.play();
         }
         else{
           audio.src = "sound2.mp3";
           audio.play();
         }
      },false);
    </script>

  </body>
</html>

答案 1 :(得分:0)

做这样的事情:

IndexError: list index out of range
IndexErrorTraceback (most recent call last)
<ipython-input-79-a852fe95d69c> in <module>()
  2     d=[]
  3     for url in ur:
----> 4         we=wego(url,annot="file.csv")
  5         d.append(we)
<ipython-input-4-9fdf25e75434> in wego(weburl, annot)
  5     soup=BeautifulSoup(html)
  6     desc=r"desc=\".*\""
----> 7     print "GO leave 2 term:",(re.findall(desc,str(soup))
 [0].split('"')[1])
  8     pattern=r"Unigene.*A"
  9     idDF = pd.DataFrame(columns=['GeneID']) #creates a new dataframe 
 IndexError: list index out of range

}