jquery如何在页面加载时执行ajax

时间:2014-03-26 11:50:04

标签: jquery ajax

我使用jquery每x秒进行一次ajax调用。我还想知道的是如何在页面加载时注册相同的ajax函数?

这是我的ajax函数的样子(每30秒触发一次)......

$().ready(function() {

    // Poll for bulletin bar message
    var url = $.url("/pollBulletin.htm");
    pollTimer = setInterval(function() {
        $.ajax({
            url: url,
            type: 'GET',
            error: function(data) {
                // The server may be down for the night or there may be a 
                // network blip. As such try to poll 10 times
                // if still failing kill the poll.
                retryCount = retryCount + 1;
                if (pollTimer != null && retryCount >= maxRetries) {
                    clearInterval(pollTimer);
                }
            },
            success: function(bulletinBarMessage) {
                // Once we have a successful poll reset the retry count.
                retryCount = 0;
                var respContent = "";
                respContent += bulletinBarMessage.messageLevel + " : ";  
                respContent += bulletinBarMessage.message;  
                $("#mt-news").html('<ul><a href="#" target="_self">' + respContent + '</a></ul>');
            }
        });
        // When communication with the server is lost stop the poll.
        }, pollInterval);
});

由于

3 个答案:

答案 0 :(得分:1)

只需在页面加载中使用与setInterval()中相同的功能。

$(document).ready(function() {

// Poll for bulletin bar message
var url = $.url("/pollBulletin.htm");

loadData();
pollTimer = setInterval(loadData, pollInterval);

function loadData() {
    $.ajax({
        url: url,
        type: 'GET',
        error: function(data) {
            // The server may be down for the night or there may be a 
            // network blip. As such try to poll 10 times
            // if still failing kill the poll.
            retryCount = retryCount + 1;
            if (pollTimer != null && retryCount >= maxRetries) {
                clearInterval(pollTimer);
            }
        },
        success: function(bulletinBarMessage) {
            // Once we have a successful poll reset the retry count.
            retryCount = 0;
            var respContent = "";
            respContent += bulletinBarMessage.messageLevel + " : ";  
            respContent += bulletinBarMessage.message;  
            $("#mt-news").html('<ul><a href="#" target="_self">' + respContent + '</a></ul>');
        }
    });
}
});

正如A. Wolff建议您还应该引入超时。

答案 1 :(得分:0)

你应该把你的代码放在document.ready中,如下所示

$(document).ready(function() {

    // Poll for bulletin bar message
    var url = $.url("/pollBulletin.htm");
    pollTimer = setInterval(function() {
        $.ajax({
            url: url,
            type: 'GET',
            error: function(data) {
                // The server may be down for the night or there may be a 
                // network blip. As such try to poll 10 times
                // if still failing kill the poll.
                retryCount = retryCount + 1;
                if (pollTimer != null && retryCount >= maxRetries) {
                    clearInterval(pollTimer);
                }
            },
            success: function(bulletinBarMessage) {
                // Once we have a successful poll reset the retry count.
                retryCount = 0;
                var respContent = "";
                respContent += bulletinBarMessage.messageLevel + " : ";  
                respContent += bulletinBarMessage.message;  
                $("#mt-news").html('<ul><a href="#" target="_self">' + respContent + '</a></ul>');
            }
        });
        // When communication with the server is lost stop the poll.
        }, pollInterval);
});

答案 2 :(得分:-1)

试试这个。

$(document).ready(function(){

    makeAjaxCall();

    setInterval(function() {
          // Do something every 30 seconds
          makeAjaxCall();
    }, 30000);

    function makeAjaxCall() {
      // your ajax call from here
    }
});

你需要实施A Wollf所说的内容,以及应该如何做,

  
    

当谈到间隔延迟的ajax请求时,不要使用间隔,考虑使用超时,只在请求完成后再调用一个新的

  
$(document).ready(function(){

    makeAjaxCall();

    function makeAjaxCall() {
      // your ajax call from here
      $.ajax({
        // option1
        // option2
        // option3
        success: function(){setTimeout(makeAjaxCall, 30)},
        error: function(){setTimeout(makeAjaxCall, 30)},
      })
    }
});