我想点击一张图片,它会变成另一张图片,但它不起作用, 我使用了 w3schools.com 的代码,但它也不起作用
这是代码:
<!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>
最佳答案
你的代码有问题
在这里你只使用带有扩展名的图像文件的名称你还需要给出图像的相对文件路径:像这样
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>
关于javascript图像onclick不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46644959/