如何在循环中显示一个图像

How to display one image in loop?

本文关键字:一个 图像 显示 循环      更新时间:2023-09-26

我试图在循环中显示一个图像。知道路径和image-name是正确的这个例子,如何在循环中显示一个图像,当没有找到图像时,浏览器显示最后一个正确的image-name,直到找到image-name ?

@{int j=1;}
<img src="" />
<script>
    (function () {
        for (var i = 1; true; i++) {
            @{ string file = "/MonitoringN/../bitmaps/" + j + ".png"; bool a = System.IO.File.Exists(file) == true; }
            var str = "/MonitoringN/../bitmaps/" + i + ".png";
            var b = "@a";
            if (b)
            {
                setInterval(function () { $('img').prop('src', str); }, 1000);
            } else {
                i--;
                @{j--;}
            }
            @{j++;}
        }
    });
</script>

因为当我执行这段代码时,我得到一个空白图像,然后我看不到页面正在加载

非常感谢!

我想我知道你想做什么…

如果我正确理解问题,你有一个图像列表,你想尝试打开它们,直到找到其中一个。如果没有找到图像,您希望跳到下一个。

首先,为了回答你的问题,我将Razor的东西和Javascript分离成非常独立的部分。事实上,我打算完全跳过Razor。

<html>
<head>
<title>A test</title>
</head>
<body>
<img src="http://x.invalid" id="myImage">
<script>
var imgs = [
  "http://x1.invalid/none",
  "https://www.google.com/images/srpr/logo11w.png",
  "http://thedailywtf.com/Resources/Images/Primary/logo.gif"
];

var imageIndex = 0;
function tryNextImage() {
  var img = document.getElementById("myImage");
  img.onerror = function() {
    imageIndex++;
    tryNextImage();
  }
  img.src = imgs[imageIndex];
}
// start the ball rolling
tryNextImage();
</script>
</body>
</html>