2013-12-20 55 views
0

我试图给绿色或红色的变量颜色值,并从那里给imagePath一个特定的src取决于给予颜色的值。用onclick函数改变图像的颜色不起作用?

从那里我可以通过按任意一个按钮在红色和绿色之间连续切换衬衫图像。

实际发生的是衬衫颜色变成红色。之后,即使按下激活green()功能的绿色按钮,它也不会变为绿色。

My HTML code: 

<html> 
<head> 
    <script src="oands.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
    var color; 
    function red(){color = "red"; change()} 
    function green(){color = "green"; change()} 

    function change() 
    { 
     if(color = "red") 
     { 
      imagePath = 'images/red-t-shirt.png'; 
      } 
     if(color = "green") 
     { 
      imagePath = 'images/green-t-shirt.png'; 
     } 
     O("shirt").src = imagePath; 
    } 
    </script> 
    <title></title> 
</head> 

<body> 
    <div id="wrapper"> 
     <div id="content"> 
      <img id="shirt" name="shirt" src="images/white-t-shirt.png"> 
      <div class="smallbox" id="redBox" onclick="red()"> 
       red 
      </div> 

      <div class="smallbox" id="greenBox" onclick="green()"> 
       green 
      </div> 
     </div> 
    </div> 
</body> 
</html> 

oands.js代码:

function O(obj) 
{ 
    if (typeof obj == 'object') 
    return obj; 

     else 
    return document.getElementById(obj) 
} 

回答

1

你应该这样做:

if(color == "red") 
{ 
    imagePath = 'images/red-t-shirt.png'; 
} 
if(color == "green") 
     //^^ note the logical compare operator. Double equals 
{ 
    imagePath = 'images/green-t-shirt.png'; 
} 

而且,在这一行:

function red(){color = "red"; change();} 
     //You're missing a semicolon ^^ 

为了更加准确,如果您知道color始终是字符串,您应该使用===。看到这个职位的更多细节:Which equals operator (== vs ===) should be used in JavaScript comparisons?

+0

谢谢!我是一个初学者。这真的帮助谢谢! – user3121403

+0

@ user3121403欢迎您:) – gideon