Question

我的应用程序是MVC，使用MS SQL获取图像文件名。我使用以下脚本来预加载图像;想知道如何在等待完成预加载时显示沙漏光标。

  function preload_images() {
            var i, count = 0;
            $('#selector').css('cursor', 'wait');
            for (i = 1; i < sl; i++) {
                images[i] = new Image();

                images[i].onload = images[i].onerror = function () {
                    count++;
                    if (count == sl) {
                        $('#selector').css('cursor', 'default');
                    }
                }
                 images[i].src = impath.toString() + im.toString() + i + ".jpg";

            }
        }

它第一次运行很好，但是，当我从下拉列表中更改文件名时，即使所有图像都加载，沙漏也不会停止。提前谢谢。

Answer 1

从上面的代码中您正在加载sl-1张图片，但停止等待光标的条件是sl张图片（if (count == sl)），因此请将其更改为if (count == (sl-1)) < / p>

Answer 2

感谢Musa提供初始解决方案，以下是我开始工作的方式，以防万一有人在寻找它：

 var images = [];
        function preload_images() {
            showLoadingImage();
            $('#selector').css('cursor', 'wait');
            for (i = tochar; i < sl; i++) {
                images[i] = new Image();
                var name = impath.toString() + imStart.toString() + i + ext;
                images[i].src = 'ImageHandler.ashx?img=' + name + '&window=50&level=50 &slice=0';
                if (i == sl - 1) {
                    images[i].onload = images[i].onerror = function () {
                        $('#selector').css('cursor', 'Default');
                        hideLoadingImage(this);
                    };
                }
            }
        }
        function showLoadingImage() {
            $('#imagediv').append('<div id="imagediv1"><img src="../Content/images/ajax-loader2.gif" alt="Loading..." /></div>');
            $('#imagediv1').show();
        }

        function hideLoadingImage(img) {
            $('#imagediv1').hide();
            img.onload = img.onerror = null;
       }

预加载图像image.onload脚本MVC

2 个答案: