Question

我希望在刷新后随机化我的网页上的图像和颜色对。例如，刷新时，它将显示“img A”和“＃999;”，然后它可能会显示“img B”和“#fff;”;基本上，一个图像与一种颜色配对，并且该颜色永远不会与不同的图像一起使用。

棘手的部分是我需要在css / div“a：hover {”下随机化颜色，并且图像在不同的id下随机化（我把它命名为#scanner，如果有帮助的话）

到目前为止，我有这个，但它没有用。我对javascript不是很有经验所以我完全陷入困境（尽管我可能只是错过了一些非常简单的东西）。

<script>

 var colors = [["#CCCCCC",     "http://static.tumblr.com/ixbct68/1y1niuvxl/wwo.gif"], ["#7b9fb9",     "http://static.tumblr.com/ixbct68/2bzniuwcf/nottarget.gif"], ["#3df756",     "http://static.tumblr.com/ixbct68/eFxniuwqz/nonlethal.gif"]];

  var r = Math.floor(Math.random() * 4);
  document.getElementById("scanner").innerHTML = "<font   color=\"" +     pairs[r][0] + "\"<img src=\"" + pairs[r][1] +   "\">"

  text.css('color', colors[col][0]);
  </script>



<div id="scanner">
<script>
    document.getElementById("scanner").innerHTML = "<img src = \"" +     colors[col][1] + "\">"
  </script>
  </div>

Answer 1

数组中只有三个项目，但是您创建的是0到3之间的随机数（四个不同的值），因此有时它会尝试获取数组外的项目。创建一个介于0和2之间的随机数，或者更好但只是使用数组的长度，以便它自动调整为放入数组中的任何内容：

var r = Math.floor(Math.random() * colors.length);

之后，您尝试访问尚不存在的元素。由于元素在页面中向下，因此在脚本运行时尚未解析它的代码。您应该将代码放在元素之后，或者放在页面的load事件中。

代码使用一个名为pairs的数组，该数组不存在，并且它生成的HTML代码是错误的。有一个font元素（顺便弃用），它没有结束括号（>）且没有结束标记（</font>）。这样的东西就是你要用的东西：

document.getElementById("scanner").innerHTML = '<span style="color:' + colors[r][0] + '"><img src="' + colors[r][1] + '"></span>';

然后有一些代码使用不存在的变量text。

然后你有了你想要改变的元素，以及该元素中的更多脚本。在仍然被解析时（即在结束标记之前）更改元素可能会有一些未预料到或不可预测的行为，例如，结束标记可能会生成另一个元素，或者作为其他元素的结束元素。

元素中的脚本重复了一些早期的脚本，但它没有使用颜色。

让我们按正确的顺序排列代码，并清除您不需要的内容：

＆＃13;

<div id="scanner"></div>

<script>

  var colors = [
    ["#CCCCCC", "http://static.tumblr.com/ixbct68/1y1niuvxl/wwo.gif"],
    ["#7b9fb9", "http://static.tumblr.com/ixbct68/2bzniuwcf/nottarget.gif"],
    ["#3df756", "http://static.tumblr.com/ixbct68/eFxniuwqz/nonlethal.gif"]
  ];

  var r = Math.floor(Math.random() * colors.length);
  document.getElementById("scanner").innerHTML = '<span style="color:' + colors[r][0] + '"><img src="' + colors[r][1] + '"></span>';

</script>

＆＃13;

在网页上随机化图像和颜色对

1 个答案: