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=' 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;  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();
        }