Jquery微调覆盖加载

问题描述：

我目前正在使用jQuery/Ajax。我想在添加ajax请求时添加一个微调器。我的方案是：UI中有两个选项卡，一个是Home，另一个是活动。所以，当用户点击活动标签时，它会向后端发出一个Ajax请求。在这一点上，我想添加一个加载微调覆盖到整个页面。我目前正在使用jQuery块UI。我似乎没有与此工作。我有这样的代码：Jquery微调覆盖加载

beforeSend: function (xhr) { 
    $.blockUI({message: $("#spinner")}); 
    //show the loading spinner. 
}, 
success: function (data) { 
    //get the data. 
}, 
error: function (error) { 
    //get the error response. 
}, 
complete: function (jqXHR, textStatus) { 
    $.unblockUI(); 
    //hide the loading spinner 
}

我有微调元素是这样的：

<div id="spinner" style="background:url('assets/img/spinner.gif')"></div>

有我丢失的东西在这里....

更新：（解决） 原因是由于ajax同步性质。它会锁定浏览器，直到收到响应。所以，我通过调用改变为异步。你可能想在这里寻找更多的讨论。 view

在更新的一句不正确：AJAX是不是天生同步的（它的全称是“异步JavaScript和XML”）。你可以做一个同步调用（强烈劝阻顺便说一句），但这并不意味着AJAX是同步的。 –

@阿尔瓦罗，我明白你在说什么。我正在使用ajax的同步请求。这使得微调不可能加载。 –

答

根据jQuery BlockUI Plugin's documentation，message参数需要一个HTML字符串。

所以，你必须改变你的代码的该部分：

$.blockUI({ message: $("#spinner").html() });

感谢您的及时回应，但它似乎并没有这样工作。 –

@RossiRobinsion既然你已经解决了问题，你可以回答自己的问题，并将其标记为48小时后接受的问题。 – Buzinas

Jquery微调覆盖加载

相关推荐