.js沒有從HTML文件調用

我想製作一個使用html和.js的視頻播放器，但是無法通過html調用attach1.js文件。以下是我的html文件：.js沒有從HTML文件調用

<!Doctype html> 

<html lang='en'> 

     <head> 
      <meta charset="utf-8"/> 
      <link rel="stylesheet" href="attach1.css"> 
      <script type="text/javascript" src="attach1.js"> </script> 
     </head> 

     <body> 

     <section id="skin"> 
      <video id="myMovie" width="640" height="360"> 
       <source src="bnm.mp4"> 
      </video> 

      <nav> 
       <div id="buttons"> 
        <button type="button" id="playButton"> Play 
       </button> 
       </div> 

       <div id="defaultBar"> 
        <div id="progressBar"> </div> 
       </div> 

       <div style="clear:both"> </div> 
      </nav> 
     </section> 

     </body> 

</html>

以下是我的attach1.js：

 document.write('Hi'); 
     function doFirst() 
     { 
      barSize=600; 
      myMovie1=document.getElementbyId('myMovie'); 
      playButton1=document.getElementbyId('playButton'); 
      bar=document.getELementbyId('defaultBar'); 
      progressBar1=document.getElementById('progressBar'); 
      document.write('Hi'); 
      playButton1.addEventListener('click', playorpause, false); 
      bar.addEventListener('click', clicker, false); 
     } 

     function playorpause() 
     { 
      if(!myMovie1.paused && !myMovie1.ended) 
      { 
       myMovie1.pause(); 
       playButton1.innerHTML='Play'; 
       window.clearInterval(updateBar); 
      } 

      else 
      { 
       myMovie1.play(); 
       playButton1.innerHTML='Pause'; 
       updateBar=setInterval(update, 500); 
      } 
     } 

     function update() 
     { 
      if(!myMovie1.ended) 
      { 
       var size=parseInt(myMovie1.currentTime*barSize/myMovie1.duration); 
       progressBar1.style.width=size+'px'; 
      } 

      else 
      { 
       progressBar1.style.width='0px'; 
       playButton1.innerHTML='Play'; 
       window.clearInteval(updateBar); 
      } 
     } 

     function clicker(e); 
     { 
      if(!myMovie1.paused && !myMovie1.ended) 
      { 
       var mouseX=e.pageX-bar.offsetLeft; 
       var newtime=mouseX*myMovie1.duration/barSize; 
       myMovie1.currentTime=newtime; 
       progressBar1.style.width=mouseX+'px'; 
      } 
     } 

     window.addEventListener('load', doFirst, false);

的attach1.js甚至不打印 '嗨'（在.js文件的第一行）。這意味着文件沒有被.html文件調用。但是，我無法弄清楚這個原因。

任何幫助表示讚賞。謝謝。

來源

2014-10-26 Yaan Xuin

將「document.write」更改爲「console.log」，並使用Firefox中的Firebug調試器或Chrome中的開發人員工具嘗試此操作。告訴我們會發生什麼。 – 2014-10-26 16:40:54

您的javascript文件attach1.js與html文檔位於同一文件夾中嗎？文件名在linux機器上是區分大小寫的（attach1.js！= attach1.JS）。 – sbrbot 2014-10-26 16:44:34

你的html文件在哪裏，js文件在哪裏 - 當你在瀏覽器中直接加載javascript文件的正確url時，你會看到什麼？最明顯的原因是src根本沒有指向你的js文件。 – AD7six 2014-10-26 16:49:31

你有：

function clicker(e); 
{ 
//code 
}

而不是

function clicker(e) 
{ 
//code 
}

我也越來越沒有找到attach1.css錯誤文件，但那是因爲我沒有你的.css文件

編輯

你調用的document.getElementById VS文件。 getElementById

你真的應該看看開發者工具。他們是你的朋友。

來源

2014-10-26 16:44:38 FuriousFolder

您可以在.html文件中註釋掉.css文件電話 – 2014-10-26 16:55:12

我編輯了我的答案。你是否通過開發者控制檯運行（F12鉻） – FuriousFolder 2014-10-26 17:03:52

另外，你打電話getELementById vs getElementById – FuriousFolder 2014-10-26 17:05:40

你必須要麼把另一個標籤在你的HTML，或通過調用它使用一個按鈕，像這樣來調用attach1.js功能： <button type='button' onclick="play function()">Play</button> 只需更換「播放功能」用函數的名稱你必須玩東西。

來源

2014-10-26 16:41:37 thelearnerofcode

你在你的代碼中的錯誤，從該行刪除半柱

function clicker(e);

這將是看錯誤的JS控制檯一個好主意

來源

2014-10-26 16:43:25 riss

這是真的，但它不會阻止所有錯誤被解析。 – AD7six 2014-10-26 16:48:07

更正了; - 沒有改變，.js仍然沒有被調用！ – 2014-10-26 16:54:16

.js沒有從HTML文件調用

回答

相關問題