Question

我有6x6 html - table。每个<td>保留<img id="1back" src="" />，其中每个id元素的img被声明为"1back"到"36back"。此外，我有18个名为"1.jpg"到"18.jpg"的.jpg文件。每个图像必须在网格中出现两次，随机分布。

我想按照以下方式完成此任务：

    function PopulateGrid() {

        for (var i = 1; i <= 18;i++) //For each image file
        {
            var randomnumber = Math.floor(Math.random() * (36 - 1 + 1)) + 1; // get random # 1-36


            while (document.getElementById(randomnumber + "back").src != "")
            {
              //if the randomly chosen <img> id is not "" genrate another random number
               randomnumber = Math.floor(Math.random() * (36 - 1 + 1)) + 1;
            }

            document.getElementById(randomnumber + "back").src = "Images/" + i + ".jpg";


            //Doing this twice as every image has to appear twice
            while (document.getElementById(randomnumber + "back").src != "") {
                randomnumber = Math.floor(Math.random() * (36 - 1 + 1)) + 1;
            }

            document.getElementById(randomnumber + "back").src = "Images/" + i + ".jpg";
        }
    }

我在IE，Chrome和FireFox中遇到了奇怪的行为。脚本在第一个while条件下失败。在我看来，就像一些无尽的循环。我没有收到任何错误消息，页面根本就没有停止加载。

我想这必须像往常一样显而易见但我在这里看不到问题。

Answer 1

尝试使用控制台查看你的img的src，当你将src设置为“”时，你最有可能得到你的基本网址，所以你的！=“”永远不会是假的。尝试设置你的img：

<img id="1back">

然后src != ""应该验证，直到你分配一个src。

设置img元素的.src失败

1 个答案: