我对 JavaScript 完全陌生。 我需要点击时随机更改图像。 这是我的代码。怎么了？ 我正在尝试制作一个骰子游戏，您可以在其中掷骰子并弹出图像值。 当我单击图像时，我只会在屏幕上看到数字变化，但图像仅从 1.jpg 变为 6.jpg，仅此而已。
HTML
<img id="myImage" onclick="changeImage()" src="1.jpg" width="100" height="100">
<p id="pl" ></p>
JS
function myFunction() {
var x = Math.floor((Math.random() * 6) + 1);
document.getElementById("pl").innerHTML = x;
}
function changeImage() {
var image = document.getElementById('myImage');
var pl;
pl = myFunction();
if (pl == 1) {
image.src = "1.jpg";
} else if (pl == 2) {
image.src = "2.jpg";
} else if (pl == 3) {
image.src = "3.jpg";
} else if (pl == 4) {
image.src = "4.jpg";
} else if (pl == 5) {
image.src = "5.jpg";
} else {
image.src = "6.jpg";
}
}
最佳答案
myFunction没有返回x ，但您正在设置 p1 = myFunction() ，所以p1将等于 undefined 。添加返回语句来修复:
function myFunction() {
var x = Math.floor((Math.random() * 6) + 1);
document.getElementById("pl").innerHTML = x;
return x;
}
以下是一些其他提示:
- 您不需要多个
<script>标签。您的所有代码都可以放在一起。 -
<script>标签应该位于您的<head>内或<body>。<html>的标记无效包含<head>以外的任何内容或<body>MDN (尽管它可能仍然有效)。 - 而不是一个巨大的
if声明，尝试使用switch. - 更好，只需设置
image.src = p1 + ".jpg"。更容易阅读! - 您的开头拼写错误
<hml>塔格。
否则，您似乎正在成为一名出色的 JavaScript 开发人员!坚持下去! :)
关于javascript - 通过id改变图片，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35659366/