BlockUI旋转器未加载

Question

我有一个页面，当用户点击一个按钮，我使用'blockUI' (http://malsup.com/jquery/block/)来显示一个模态消息说，'发送'与一个旋转器。

$('#btnSend').click(function () {
    $.blockUI({ message: '<h4><img src="http://www.example.com/images/busy.gif" /> Sending email...</h4>' });
});

当我将该URL复制到浏览器中时，我看到了旋转的图像。然而，在网站上，它显示了一个无效的图像占位符，好像图像文件不存在，或者它是一个无效的URL。

当我"查看源"并将页面上的URL复制到一个新的浏览器中时，它工作得很好。我是否需要预先加载图像?

Answer 1

UPDATE

在body标签中添加<img src="http://www.accufinance.com/images/busy.gif" id="loader"/>。也把它添加到你的css文件。

#loader{
    display: none;
}

你应该把你的blocki代码改成

$。{message: $('#loader')});

确保你的标签在$的上方。blockUI脚本。

PS:我希望你使用的不是像http://www.accu....../busy.gif那样的绝对路径，而是像/images/busy.gif那样的路径

---------------------------------------------------------------------------------------------------------------------------------

我从控制台添加了这段代码到您的网站

$('body').append('<img src="http://www.accufinance.com/images/busy.gif"/>');

之后，gif工作完美。因此，在下载图像之前提交表单。把gif放到dom中，而不是动态下载。

希望能有所帮助。