Question

成功显示图像损坏图标之前。如何预防或有更好的解决方案 - 这是我的代码

var menuName = ['about.jpg', 'concerns.jpg', 'contact.jpg', 'gallery.jpg'];
                    $.ajax({
                        url: htmlContetPage[menuItem],
                        success: function (data) {
                            $('.content_area').html(data);
                            $("img").error(function(){
                                $(this).hide();
                            });
                            $('.wheelSelect').html('<img style="width:100%;overflow:hidden;" src="images/' + menuName[menuItem] + '" />');
                        },
                        dataType: 'html'
                    })

Answer 1

预加载图像，然后将其添加到html。

var menuName = ['about.jpg', 'concerns.jpg', 'contact.jpg', 'gallery.jpg'];
$.ajax({
    url: htmlContetPage[menuItem],
    success: function (data) {
        $('.content_area').html(data);
        $("img").error(function(){
            $(this).hide();
        });
        var image = new Image();

        image.onload = function() {
            $('.wheelSelect').html('<img style="width:100%;overflow:hidden;" src="images/' + menuName[menuItem] + '" />');
        };

        image.src = 'images/' + menuName[menuItem];
    },
    dataType: 'html'
})

如何在图像损坏图标之前防止ajax成功显示？

1 个答案: