Question

我正在使用Asp.net MVC，我希望我的部分视图在一个时间间隔内刷新，直到我发出一个不相关的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);
}

Answer 2

我不会使用setInterval来更新内容，就好像内容加载时间超过1秒，您将在队列中有多个请求..

请求完成后使用setTimeout

function sendRequest(){
    $.ajax({
       /** your post data code **/
       complete : function(xhr, status){
                      setTimeout('sendRequest',1000);
                 }
    });
}

这样第二个请求就不会在第一个请求完成之前完成。这也应该解决你的问题。

Answer 3

尝试向您发布AJAX请求的网址添加一些随机性。像$.post(f.attr("action")+"?"+Math.random(), ...)这样的东西。我从来没有弄清楚为什么会这样，但它确实（有时）。可能是因为您阻止浏览器使用缓存结果进行AJAX响应。

Answer 4

一些愚蠢的问题......你在浏览器中启用了java脚本调试吗？

我已经在我的示例应用程序中提供了相同的示例，直到我将以下脚本添加到Site.Master之后它才能正常工作：

<script src="../../Scripts/jquery.js" type="text/javascript" ></script>
<script src="../../Scripts/MicrosoftAjax.debug.js" type="text/javascript" ></script>
<script src="../../Scripts/MicrosoftMvcAjax.debug.js" type="text/javascript" ></script>

如果这没有帮助，请检查单击“发送”时从“索引”方法获得的结果类型。是PartialView还是常规View？如果是常规的，你用干净的html擦除整个页面（即使没有文档）。

如果这仍然没有帮助，这是我的示例应用程序，您的示例正在运行（至少我理解它的方式）。

http://www.sendspace.com/file/gk2qro

Answer 5

如果您的AjaxRefresh.js只包含您向我们展示的代码，则可以使用此代码。当浏览器调用.js时，它将开始运行。

var ajax = {

    init: function() {
        ajaxRefresh();
        setTimeout(init, 1000);
    }

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

Answer 6

在匿名函数中包装ajaxRefresh并使用括号调用它对我有用。所以你的倒数第二行代码就像setInterval(function () { ajaxRefresh() }, 1000)。

我也不理解。

Answer 7

我刚刚用setInterval处理了同样的问题。我做了什么让它继续刷新是在十个请求（间隔点火）之后，清除间隔计时器并再次创建它。有效地重新启动它。

setInterval在Ajax请求后停止

7 个答案: