javascript - IE8显示图像，Chrome/Firefox使用BlockUI不显示图像

Question

IE8显示图像，Chrome/Firefox不使用BlockUI显示图像

我的代码是:

<link href="css/jquery-ui.css" rel="stylesheet" />
<script src="js/jquery-1.8.0.js"></script>
<script src="js/jquery.blockUI.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#btnSubmit').click(function () {
            $.blockUI({ 
                theme: true,
                title: '<img src="images/titulo.png" />',
                message: '<center><p><img src="images/spinner.gif" /></p><p><img src="images/mensagem.png" /></p></center>'
            });
        });
    });
</script>    

有人可以帮助我吗？提前致谢。

Answer 1

我今天也遇到这个问题，终于找到解决办法了。当触发加载另一个页面的操作时，BlockUI 似乎无法加载图像。但是，如果您在点击事件之前在 JS 中预加载图像，则效果很好。

$(document).ready(function () {

  //preload your images here
  img1 = new Image();
  img1.src = "images/titulo.png";
  img2 = new Image();
  img2.src = "images/spinner.gif";

  $('#btnSubmit').click(function () {
    $.blockUI({
      theme: true,
      title: '<img src="images/titulo.png" />',
      message: '<center><p><img src="images/spinner.gif" /></p><p><img src="images/mensagem.png" /></p></center>'
    });
  });

});