Javascript 如何在ajax调用后模糊内容

我在我的页面上使用ajax调用，它会更改分区块的内容。 我想要的是在加载新内容之前使div内容模糊

所以

第一步：点击按钮

步骤2：模糊分割块的内容，用户现在无法从该分割中选择任何内容

步骤3：加载内容并恢复正常状态

---

步骤1和3已经完成。我需要的是第2步。

如果您使用jQuery，则会做得很好。

我将使用

onreadystatechange

创建一个函数，并对该区域设置模糊，直到

readystate==4

。现在，模糊的类型和实现方式将取决于您，但我使用了类似的想法，使用我的淡入淡出功能在类似这样的ajax调用中淡入淡出文本

假设主内容块的id为“main”

在加载内容等之前，单击按钮的onclick。。做：

var pos = $('#main').offset();
var size = { w: $('#main').outerWidth(), h: $('#main').outerHeight() };
$('<div class="main_overlay"></div>')
  .css({left: pos.left+'px', top: pos.top+'px', width: size.w+'px', height: size.h+'px'})
  .appendTo('body');

一旦所有内容都已加载，并且您已准备好解除锁定，请执行以下操作：

$('.main_overlay').remove();

---

答案假设您正在使用jQuery.：）

$('.main_overlay').remove();