Question

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

现在我如何在复制和粘贴之间显示一个微调器，使得带有treeview的窗口变得褪色并显示一个微调器，直到粘贴完成。任何帮助表示赞赏。

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

Answer 1

您可以使用ajaxSend和ajaxComplete - 在发送时显示，在完成时将其删除。

使用CSS创建一个带有微调器图形背景的元素，或者添加一些文本等...

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

您可以在活动期间向目标树添加叠加层或淡入淡出等...

Answer 2

实现所需功能的一种方法是使用隐藏的<div>标记。你需要2个div来完成这个：

div灰色和＆amp;高度透明，覆盖了加载时想要灰化的区域。
div包含你的旋转gif图像。

现在，当您加载该部分时，请打开两个div的css可见性，并在加载完成后，将可见性翻转回来。

〜瞧

Answer 3

$("#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");
              }
        });
     }
  });

});

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

窗口上的微调框

3 个答案: