Ajax 窗上的旋转器

我有一个窗口，它有一个带有节点和子节点的树状视图。复制子节点/节点并尝试将其粘贴到另一个节点时，窗口往往没有响应。粘贴完成后，将刷新目标粘贴。此功能如下所示

现在，我如何在复制和粘贴之间显示微调器，以使带有treeview的窗口褪色并显示微调器，直到粘贴完成。感谢您的帮助

$.ajax({
    type: 'POST',
    url: '/test.aspx',
    data: data,
    success: function(result) {
        refresh(id);
        if (result != "SUCCESS") alert("Copy failed");
        else {
            alert("Successfully Copied");
        }
    }
});

您可以使用ajaxSend和ajaxComplete进行此操作-发送时显示，完成时删除

使用CSS创建一个带有旋转图形背景的元素，可能会添加一些文本等

$("#Loadstatus").bind("ajaxSend", function() {
    $(this).text(loadingMessage);
    $(this).show();
}).bind("ajaxComplete", function() {
    $(this).hide();
});

---

您可以在事件期间向目标树添加覆盖、淡入淡出等…

实现所需功能的一种方法是使用隐藏标记。您需要2个div来完成此操作：

灰色div&高透明度，覆盖加载时要灰显的区域。 包含旋转gif图像的div。 现在，在加载节时，打开两个div的css可见性，加载完成后，关闭可见性

~z~瞧

---

假设divProgress是要显示加载图像的Div，而旋转图像的名称是yourImg.gif。您可能需要根据您的场景更改图像路径。

谢谢。但是fadein和fadeout不起作用。粘贴时，微调器开始并持续显示，即使粘贴完成。@LenSmith:我认为淡出应该在if条件之外。我更新了我的答案。试试看对不起，但还是不行。粘贴完成后，窗口的内容不会显示。窗口的内容意味着什么？更新的树视图？您需要在成功时在DOM中重新填充它

$("#divProgress").html("<img src='yourImg.gif' alt='loading..' />").fadeIn(100,function(){

   $.ajax({
     type: 'POST',
     url: '/test.aspx',
     data: data,
     success: function(result) {
        $("#divProgress").fadeOut(300,function(){
              refresh(id); // not sure what this does!!! ...??
              if (result != "SUCCESS") 
              {
                 alert("Some error!");
              }
              else
              {
                 alert("Successfully Copied");
              }
        });
     }
  });

});