我正在尝试使用javascript将图像替换为另一个图像,但是它不起作用。

时间:2020-07-09 08:07:41

标签: javascript html jquery css

body
{
    background-image: url("background-test.gif");
}
h1
{
    font-size: 70px;
    font-family: geneva;
    color: black;
    text-shadow: 3px 3px 2px red;
    text-align: center;
    text-decoration: underline;
}
h2
{
    font-size: 50px;
    font-family: geneva;
    color: black;
    text-shadow: 3px 3px 2px red;
    text-align: center;
}
a
{
    text-decoration: none;
}
a h3
{
    font-family: geneva;
    font-size: 35px;
    border-radius: 2px;
    border-color: black;
    color: black;
    background-color: gray;
    width: 120px;
    text-align: center;
    position: absolute;
    top: 400px;
    right: 650px;
    
}
#computer
{
    position: absolute;
    bottom: 200px;
    right: 100px;
}
#user
{
    position: absolute;
    bottom: 200px;
    left: 100px;
}
#versus
{
    position: absolute;
    bottom: 280px;
    left: 600px;
    color: black;
    text-shadow: 2px 2px 3px gray;
    font-size: 120px;
    
}
#msg
{
    position: absolute;
    top: 400px;
    left: 100px;
}
#stone
{
    position: absolute;
    top: 550px;
    left: 200px;
}
#paper
{
    position: absolute;
    top: 550px;
    left: 300px;
}
#scissors
{
    position: absolute;
    top: 550px;
    left: 400px;
}

我正在尝试通过单击图像stone.png来更改图像user.png,单击该图像会调用函数change(),但该函数未替换图像,但是我检查了该函数是否被调用我发现它正在被调用,只是没有替换图像。

function change()
{

     if(document.getElementbyId('stone').clicked == true)
     {
         document.getElementbyId('user').src="stone2.jpg"
     }

}
  <!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>
<body>
<img id="computer" src="computer.jpg" width="400" height="400">
<h1 id="versus"> Vs </h1>
<img id="user" src="user.png" width="400" height="400">
<h2 id="msg"> Choose your option !! </h2>
<a href="" onClick="change()"> <img id="stone" src="stone.png" width="70" height="70"></a>
<a href="" onClick="change()"> <img id="paper" src="paper.jpg" width="70" height="70"></a>
<a href="" onClick="change()"> <img id="scissors" src="scissors.jpg" width="70" height="70"></a>
<script type="text/javascript" src="jscode.js"> </script>
</body>
</html>

0 个答案:

没有答案