JavaScript图片的onclick将无法正常工作

我想点击一个图像上，它变成另一种，但它不会工作，我使用的代码从w3schools.com但它不会工作，要么JavaScript图片的onclick将无法正常工作

这是验证码：

<!DOCTYPE html> 
<html> 
<body> 

<img id="myImage" onclick="changeImage()" src="img/checkoff.png"> 

<script> 
    function changeImage() { 
     var image = document.getElementById('myImage'); 
     if (image.src.match("checkon")) { 
      image.src = "checkoff.png"; 
     } else { 
      image.src = "checkon.png"; 
     } 
    } 
</script> 

</body> 
</html>

来源

2017-10-09 Daan

您是否收到过错误？ –

在if/else语句中，您必须将文件夹添加到图像名称。 'image.src ='img/checkoff.png''和'image.src ='img.checkon.png'' –

需要很多修改才能使其正常工作 – iamsankalp89

有代码中的问题

在这里你只用名的图像文件的扩展名为您还需要给图像的相对文件路径：这样

function changeImage() { 
    var image = document.getElementById('myImage'); 
    if (image.src.match("checkon")) { 
     image.src = "img/checkoff.png"; 
    } else { 
     image.src = "img/checkon.png"; 
    } 
}

在这里你可以检查这个例子。

工作顺利。

希望这将有助于你

function changeImage() { 
 
     var image = document.getElementById('myImage'); 
 
     if (image.src.match("generic-image-placeholder")) { 
 
      image.src = "https://cdn.noths-static.com/system/product_images/images/001/037/649/original_set-of-eight-white-heart-name-place-holders.jpg"; 
 
     } else { 
 
      image.src = "https://www.webpagefx.com/blog/images/cdn.designinstruct.com/files/582-how-to-image-placeholders/generic-image-placeholder.png"; 
 
     } 
 
    }

<!DOCTYPE html> 
 
<html> 
 
<body> 
 

 
<img id="myImage" onclick="changeImage()" src="https://cdn.noths-static.com/system/product_images/images/001/037/649/original_set-of-eight-white-heart-name-place-holders.jpg"> 
 

 
</body> 
 
</html>

来源

2017-10-09 11:10:00

试试下面代码工作

<img id="myImage" onclick="changeImage()" src="http://fakeimg.pl/300/"> 

<script> 
function changeImage() { 
    var image = document.getElementById('myImage'); 
    if (image.src.match("http://fakeimg.pl/250x100/")) { 
    image.src = "http://fakeimg.pl/300/"; 
    } else { 
    image.src = "http://fakeimg.pl/250x100/"; 
    } 
} 
</script>

Click Here to see jsFiddle Demo

您的代码，请更改路径时，点击图片

<script> 
    function changeImage() { 
     var image = document.getElementById('myImage'); 
     if (image.src.match("checkon.png")) { 
      image.src = "img/checkoff.png"; 
     } else { 
      image.src = "img/checkon.png"; 
     } 
    } 
</script>

来源

2017-10-09 11:11:37

-2

图像路径在您的代码中不正确。请更新如下：

<script> 
function changeImage() { 
var image = document.getElementById('myImage'); 
if (image.src.match("checkon")) { 
image.src = "img/checkoff.png"; 
} else { 
image.src = "img/checkon.png"; 
} 
} 
</script>

来源

2017-10-09 11:22:34

JavaScript图片的onclick将无法正常工作

回答

相关问题