Javascript不會讀取圖像

我正在學校進行作業，而我的老師和我很難過。我在處理過程中創建了一個基於時間的狀態機，並使這些代碼在JavaScript中工作。但是，當我運行代碼時，我只是不斷收到「加載...」屏幕。它看起來像（從查看開發人員工具）服務器無法讀取我的圖像文件。任何想法/建議？Javascript不會讀取圖像

Developer Errors & Images found in Code

var iOne; 
var iTwo; 
var iThree; 
var iFour; 
var iFive; 
var iSix; 

var counter=30; 
var state=0; 

function preload(){ 
    iOne=loadImage("wall.jpg"); 
    iTwo=loadImage("screen.jpg"); 
    iThree=loadImage("mist1.jpg"); 
    iFour=loadImage("mist2.jpg"); 
    iFive=loadImage("mist3.jpg"); 
    iSix=loadImage("mist4.jpg"); 
} 

function setup(){ 
    createCanvas(600,398); 
} 

function draw(){ 
    counter=counter-1; 
    if(counter<0){ 
     state=state+1; 
     if(state>14){ 
      state=0; 
     } 
     counter=30; 
    } 
    switch(state){ 
     case 0: 
      image(iOne,0,0); 
      break; 

     case 1: 
      image(iOne,0,0); 
      break; 

     case 2: 
      image(iTwo,0,0); 
      break; 

     case 3: 
      image(iThree,0,0); 
      break; 

     case 4: 
      image(iTwo,0,0); 
      break; 

     case 5: 
      image(iFour,0,0); 
      break; 

     case 6: 
      image(iTwo,0,0); 
      break; 

     case 7: 
      image(iFive,0,0); 
      break; 

     case 8: 
      image(iTwo,0,0); 
      break; 

     case 9: 
      image(iOne,0,0); 
      break; 

     case 10: 
      image(iTwo,0,0); 
      break; 

     case 11: 
      image(iOne,0,0); 
      break; 

     case 12: 
      image(iTwo,0,0); 
      break; 

     case 13: 
      image(iSix,0,0); 
      break; 

     case 14: 
      image(iTwo,0,0); 
      break; 
    } 
}

來源

2017-03-26 Daphne Kraft

這是什麼編輯器？編輯器所說的並不重要：瀏覽器是你應該關注的「基本事實」。看起來你正在運行某種自定義服務器，因此它們中包含隨機字符的長URL。所以我會把它當成第一個罪魁禍首。不幸的是，由於我們無法訪問該定製服務器，因此我們幾乎不可能爲您提供幫助。雖然我沒有注意到你的代碼有什麼明顯的錯誤。順便說一句，你可能想把問題縮小到[mcve]：如果錯誤在'setup（）'中，我們不需要看'draw（）'。 –

丟失函數圖像的位置（名稱，0,0）這個位必須繪製的函數的位置 – MartinWebb

我認爲路徑可能有問題。只要你同步加載這些圖像它可能卡住了一些錯誤。你能分享你的文檔樹和html內容嗎？ –

它看起來像你正在使用你的IDE中的「運行」按鈕訪問您的網頁。如果你這樣做，很容易發現錯誤：

由於您只使用JS和HTML，因此您不需要Web服務器，因此，請將項目文件夾粘貼到桌面上。
打開主要的HTML，那是runnig那個JS。
現在，如果錯誤仍然存在，您將會看到相同的404，但帶有更友好的路徑。這樣做的好處是，現在，您確切的是搜索圖像。
調整正確路徑

來源

2017-03-26 02:23:23

Javascript不會讀取圖像

回答

相關問題