Question

我做了一些研究，但我找不到问题的答案。当我点击菜单项中的选项卡时，我想要一个加载图像。下面这段代码非常适合特定事件，例如click（）等。（我已经尝试了其他几个例子），但是当我的gridview加载时它没有。我想知道，是否有任何类型的事件在jquery（我没有找到任何），当控件/实体STARTS执行加载时？我的意思是load（），onload（），ready（） - 都指的是加载完成的那一刻。

这是我的代码。任何帮助/建议都很感激：

<script type="text/javascript">
    $(document).ready(function () {
        $("#spinner").bind("ajaxSend", function () {
            $(this).show();
        }).bind("ajaxError", function () {
            $(this).hide();
        });
    });
</script>

此外，

<script type="text/javascript">
    $(document).ready(function () {
        $('#btnSave,#btnOne,#btnTwo,#btnThree,#btnFour,#btnUndo').click(function () {
            //$("#spinner").append('<img id="img-spinner" src="Images/ajax-loader-test.gif" alt="Loading.." style="position: absolute; z-index: 200; left:50%; top:50%; " />');
            $('#spinner').show().fadeIn(20);
        });
    });
</script>

和Asp代码：

<div id="spinner" class="spinner" style="display: none; width: 100%; height: 150%; position: absolute; z-index: 100; background-color: Gray; left: 0; top: 0; bottom: 0; right: 0">
     <img id="img-spinner" src="Images/ajax-loader-test.gif" alt="Loading.."         style="position: absolute; z-index: 200; left: 50%; top: 50%;" />
</div>

提前感谢您的帮助。

编辑：我尝试将我的功能更改为：

    $(document).ready(function () {
    $("#spinner").css.apply('display','none');
    });

在我的asp代码中我删除了display：none属性，但它仍然无法正常工作，我也不知道我做错了什么。

Answer 1

我会将此代码添加到您的启动函数中：

$('body').ajaxStart(function() {
  $('#spinner').show();
});

$('body').ajaxComplete(function() {
  $('#spinner').hide();
});

这将在ajax调用开始时显示div，并在完成时隐藏它。

要在初始加载页面时显示微调器，请将此行添加到document.ready：

$("#spinner").hide();

并选择“display：none;”离开了旋转器div。

如何在加载gridview时加载图像？

1 个答案: