Img/Audio通過document.getElementByID（「...」）更改。src = x +「。png」;不會工作

-1

我不知道爲什麼它不工作。既然它沒什麼特別的地方，我在網上搜索 - 在這裏，但我發現的只有教程沒有變量或者問題太具體。Img/Audio通過document.getElementByID（「...」）更改。src = x +「。png」;不會工作

任何人都可以指導我嗎？

<html> 
<head> 
<title>Test</title> 
<script type="text/javascript"> 

function changeaudio(x); 
{ 

    document.getElementById("audioplayer").src=x+".mp3"; 
    document.getElementById("image").src=x+".png"; 
} 

</script> 
</head> 
<body> 
<center> 
<img id="image" src="1.png"> 
<audio id="audioplayer" src="1.mp3" controls autoplay loop> 
Your browser does not support the audio element. 
</audio> 
<br> 

<input type="button" id="play" value="Play 1" onclick='changeaudio(1)"' /> 
<input type="button" id="play2" value="Play 2" onclick='changeaudio(2)"' /> 
<input type="button" id="play3" value="Play 3" onclick='changeaudio(3)"' /> 
</center> 

</body> 
</html>

來源

2014-01-22 jediotic

我們不是在這裏「指南「你，因爲我們不是一個dis理事會。請提出一個具體的編程問題（並確保它將在未來幫助別人！）「不工作」是什麼意思？什麼_does_發生？在調試過程中發現了什麼？ –

（本代碼中存在基本錯別字 - 請在發佈之前加倍小心） –

您是對的。當我在將來再次詢問這些問題時，我會更具體，並且花更多時間進行調試。希望它可以問：我試着用Firefox進行調試，但我試着讓它工作。有人可以推薦一種（簡單的，免費的）編輯器和一種「拼寫檢查」？（使用Notepad ++ atm） – jediotic

刪除你的函數定義後;：function changeaudio(x);應該成爲：function changeaudio(x)

此外，您onclick語法是錯誤的：onclick='changeaudio(1)"'應該是：onclick="changeaudio(1)"。

你的最終代碼應該是這樣的：

<html> 
    <head> 
     <title>Test</title> 
     <script type="text/javascript"> 
     function changeaudio(x) 
     { 
      document.getElementById("audioplayer").src=x+".mp3"; 
      document.getElementById("image").src=x+".png"; 
     } 
     </script> 
    </head> 
    <body> 
     <center> 
      <img id="image" src="1.png" /> 
      <audio id="audioplayer" src="1.mp3" controls autoplay loop> 
       Your browser does not support the audio element. 
      </audio> 
      <br /> 
      <input type="button" id="play" value="Play 1" onclick="changeaudio(1)" /> 
      <input type="button" id="play2" value="Play 2" onclick="changeaudio(2)" /> 
      <input type="button" id="play3" value="Play 3" onclick="changeaudio(3)" /> 
     </center> 
    </body> 
</html>

jsFiddle Demo

來源

2014-01-22 11:06:35 BenM

非常感謝您的快速回答:)現在完美的工作，我必須停止犯這樣的愚蠢錯誤，我現在使用Notepad ++，你碰巧知道一個很好的免費軟件編輯誰告訴我拼寫錯誤？ – jediotic

沒問題。你，你可能會喜歡，如果它被使用FUL。 – BenM

（編輯第1條評論） – jediotic

爲一個jQuery的方法：

$(function(){ 
    $('.play').each(function() { 
     var mp3 = $(this).attr("id"); 
     $(this).click(function(){ 
      $('#audioplayer').attr("src", mp3+".mp3"); 
      $('#image').attr("src", mp3+".png"); 
     }); 
    }); 

}); 

<center> 
      <img id="image" src="1.png" /> 
      <audio id="audioplayer" src="1.mp3" controls autoplay loop> 
      </audio> 
      <br /> 
      <input type="button" class="play" id="1" value="Play 1" /> 
      <input type="button" class="play" id="2" value="Play 2" /> 
      <input type="button" class="play" id="3" value="Play 3" /> 
     </center>

jsFIDDLE DEMO

來源

2014-01-22 11:17:20 Havihavi

爲什麼稱爲'mp3'的變量，即使是圖像？ –

爲什麼使用jQuery來處理某些事情**這麼簡單？ – BenM

只是一種選擇 – Havihavi

Img/Audio通過document.getElementByID（「...」）更改。src = x +「。png」;不會工作

回答

相關問題