Question

如果用户点击input - 标记（type="radio"），我会从数据库中加载新数据。因为它可以花一些时间，我会显示加载动画。之后，动画必须不显示。

现在是我的问题：我如何检测来自aspx页面的ajax请求是否已通过javascript代码完成，以便显示动画？如果不是，还有其他方法可以获得相同的结果吗？

更新1：我只使用以下代码行：

<asp:ScriptManager EnablePartialRendering="true"  runat="server" />

<asp:UpdatePanel ID="updPnlCategorieen" UpdateMode="Always" runat="server">
    <ContentTemplate>

        <asp:Panel ID="pnlHoofdTopics" CssClass="topics" runat="server" />
        <asp:Panel ID="pnlCategorien" CssClass="topics" runat="server" />
        <asp:Panel ID="pnlItems" CssClass="topics" runat="server" />

        <asp:Panel cssclass="loading" ID="pnlLaden" runat="server">
            <div class="circle"></div>
            <div class="circle1"></div>
        </asp:Panel>

    </ContentTemplate>
</asp:UpdatePanel>

并将代码置于（C＃）后面的代码：

updCategorieen.Triggers.Add(new AsyncPostBackTrigger() {
    ControlID = rbtCat.ID,
    EventName = "CheckedChanged"
});

为了显示加载动画，我使用javascript。以下代码：

var topic = []; //--> location for all the radio buttons
var laden; //--> location for loading div

document.addEventListener("DOMContentLoaded", function () {
    init();
});

function init() {

    laden = document.getElementsByClassName("loading")[0];
    topic = document.getElementsByClassName("topic");

    laden.style.display = "none";

    for (i = 0; i < topic.length; i++) {

        topic[i].addEventListener("click", function () {
            startLaden();
        });
    }

    geladen.addEventListener("change", function () {
        stopLaden();
    });
}

function startLaden() {

    laden.style.display = "block";
}

function stopLaden() {

    laden.style.display = "none";

    topic = document.getElementsByClassName("topic");
}

更新2：我还尝试在加载所有主题后在服务器端删除它。

pnlLaden.Style["display"] = "none";

这样可行，但如果我再次显示，则加载动画不会再回来。所以，我在开始时这样做。

pnlLaden.Style["display"] = "block";

但是没有效果......

我还试过在互联网上发现的一些东西，但不像live，on等那样工作，但没有任何作用。

任何人都可以帮助我，我是ajax和Asp.net的新手吗？谢谢，抱歉我的英语很差。

通过javascript检测来自asp的ajax请求的结束

0 个答案: