2012-04-18 74 views
0

這是開始爲Uni完成作業。但現在我有問題來設法切換圖像。這是爲了開始轉向比賽比賽。它假設是圖像和文字,並匹配它們,但我到目前爲止有這個切換功能的問題。我有這個代碼到目前爲止:在畫布中切換圖像

 var myButton = new Image(); 
     var mouseX = 0; 
     var mouseY = 0; 
     var backgroundImage = new Image(); 
     var nothing = "num/w/2.png"; 
     var something = "num/w/3.png"; 

     function drawButton(buttonObj) 
     { 
      canvasContext.drawImage(buttonObj, buttonObj.x, buttonObj.y); 
     } 

     function checkIfInsideButtonCoordinates(buttonObj, mouseX, mouseY) 
     { 
      if(((mouseX > buttonObj.x) && (mouseX < (buttonObj.x + buttonObj.width))) && ((mouseY > buttonObj.y) && (mouseY < (buttonObj.y + buttonObj.height)))) 
       {return true;} 
      else 
       {return false;} 
     } 

     $(function() { 
      var canvas = $("#canvas").get(0); 
      canvasContext = canvas.getContext('2d'); 
      backgroundImage.src = "num/back.jpg"; 

      $(backgroundImage).load(function() { 
       canvasContext.drawImage(backgroundImage, 0, 0); 
       myButton.x = 100; 
       myButton.y = 100; 
       myButton.width = 100; 
       myButton.height = 100; 
       myButton.src = something; 
       drawButton(myButton); 
      }); 

      $("#canvas").click(function(eventObject) { 
       mouseX = eventObject.pageX - this.offsetLeft; 
       mouseY = eventObject.pageY - this.offsetTop; 

       if(checkIfInsideButtonCoordinates(myButton, mouseX, mouseY)) 
       { 
        if(myButton.src = something) 
        { 
        myButton.src = nothing; 
        } 

        else if(myButton.src = nothing) 
        { 
        myButton.src = something; 
        } 

        drawButton(myButton); 
       } 
      }); 
}); 

任何想法爲什麼嗎?謝謝。

回答

1

jsfiddle

你需要讓你的=在if語句==。

if (myButton.src == something) { 
      myButton.src = nothing; 
     } 

     else if (myButton.src == nothing) { 
      myButton.src = something; 
     }