javascript - Ajax 请求后 setInterval 停止

Question

我正在使用 Asp.net MVC，我希望我的局部 View 每隔一段时间刷新一次，直到我发出一个不相关的 Ajax 请求，它才会停止。

这里有一些简化的片段来说明这个问题。

在 AjaxRefresh.js 中:

function ajaxRefresh()
{
    var f = $("#AjaxForm");
    $("#AjaxLoading").show();
    $.post(f.attr("action"), f.serialize(), function (context) {
        $("#AjaxDiv").html(context);
        $("#AjaxLoading").hide();
    });
}
setInterval(ajaxRefresh, 1000);

在 Index.aspx 中:

<script type="text/javascript" src="../../Scripts/AjaxRefresh.js"></script>
<div id="AjaxDiv">
    <% Html.RenderPartial("Computers", Model, ViewData); %>
</div>

这在 Computers.ascx 中:

<% Ajax.BeginForm("Index", new { groupName = Model.Name }, new AjaxOptions() { HttpMethod = "Post", LoadingElementId = "AjaxLoading", UpdateTargetId = "AjaxDiv" }, new { id = "AjaxForm" }); Html.EndForm();%>

<%= Ajax.ActionLink("Send", "Index", new { groupName = Model.Name, data="blah" },
        new AjaxOptions() { HttpMethod="Post", LoadingElementId="AjaxLoading", UpdateTargetId="AjaxDiv" }) %> 

如果您单击“发送”链接，一切仍然有效，但页面会自动停止刷新。我已尝试订阅 ajax 事件，但 Sys.WebForms.PageRequestManager.getInstance() 未定义。

Answer 1

我不确定为什么会发生这种情况，但我在过去使用 jQuery Ajax 刷新和 setInterval 时遇到过类似的问题。最后，我切换到一个重复的 setTimeout 并且没有任何问题:

function onLoad() {
    setTimeout(ajaxRefresh, 1000);
} 

function ajaxRefresh()
{
    var f = $("#AjaxForm");
    $("#AjaxLoading").show();
    $.post(f.attr("action"), f.serialize(), function (context) {
        $("#AjaxDiv").html(context);
        $("#AjaxLoading").hide();
    });
    setTimeout(ajaxRefresh, 1000);
}