DataGrid点击上下一页loading效果

js添加显示loading和取消loading方法

         function showtbloading() {
             var target = $("#GridView1");
             if (target.length <= 0) {
                 $("#tbloading").width($(window).width());
                 $("#tbloading").height($(window).height());

             } else {
                 $("#tbloading").width(target.width());
                 $("#tbloading").height(target.height());
                 $("#tbloading").css("left", target.offset().left + "px");
                 $("#tbloading").css("top", target.offset().top + "px");
             }
             $("#tbloading").find("div").eq(0).css("top", ($("#tbloading").height() - 32) / 2);
             $("#tbloading").show();
         }
         function hidetbloading() {
             $("#tbloading").hide();
         }

html添加loading效果div

        <div id="tbloading" style="position: absolute; top: 0px; left: 0px; filter: Alpha(opacity=50);
            -moz-opacity: 0.5; opacity: 0.5; background: #777; background-color: White; z-index: 1000;
            display: none;">
            <div style='width: 32px; height: 32px; left: 50%; position: relative; text-align: center;'>
                <center>
                    <img src='/pic/Rotate.gif' alt="" /><br />
                    <span style='font-size: 13px; font-weight: bolder; width: 100%; text-align: center;'>
                    </span>
                </center>
            </div>
        </div>

js注册事件

         Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(PageLoadingHandler);
         function PageLoadingHandler(sender, args) {
             showtbloading();
         }
         Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(EndRequest);
         function EndRequest(sender, args) {
             hidetbloading();
         }