Question

我有以下脚本可以解决问题。我要做的是在页面上运行该功能，然后每隔30秒再次运行它。

[代码]

$( document ).ready(function() {
$('#table').empty();
$.ajax({
    type: 'POST',
    url: 'check_current_requests2.php',
    data: $('#departcount').serialize(),
    dataType: "json", 
    success: function (data) {
    if (data) {
        var len = data.length;
        var txt = "";
        if (len > 0) {
            for (var i = 0; i < len; i++) {
                if (data[i].Department && data[i].DepartCount) {
                    txt += "<tr><td>" + data[i].Department + "</td><td>" + data[i].DepartCount + " </td></tr>";
                }
            }
            if (txt != "") {
                $("#table").append(txt);
            }
        }
    }
},
error: function (jqXHR, textStatus, errorThrown) {
alert('error: ' + textStatus + ': ' + errorThrown);
}
});
return false;
});

[/代码]

有没有人知道如何做到这一点。

非常感谢提前。

Answer 1

只需将代码放入函数中即可。然后从$(document).ready()调用该函数，并从setInterval()调用它。

$( document ).ready(function() {
    var interval;

    function run() {
        $('#table').empty();
        $.ajax({
            type: 'POST',
            url: 'check_current_requests2.php',
            data: $('#departcount').serialize(),
            dataType: "json", 
            success: function (data) {
                if (data) {
                    var len = data.length;
                    var txt = "";
                    if (len > 0) {
                        for (var i = 0; i < len; i++) {
                            if (data[i].Department && data[i].DepartCount) {
                                txt += "<tr><td>" + data[i].Department + "</td><td>" + data[i].DepartCount + " </td></tr>";
                            }
                        }
                        if (txt != "") {
                            $("#table").append(txt);
                        }
                    }
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                alert('error: ' + textStatus + ': ' + errorThrown);
                // cancel interval if getting an error so you don't get repeated errors
                clearInterval(interval);
            }   
        });
    }

    // run it initially
    run();

    // run it every 30 seconds
    interval = setInterval(run, 30 * 1000);
});

正如我已经添加到代码中，我还建议您在出现错误时取消间隔，这样您就不会遇到页面每30秒发出一次错误提醒的情况。

淡入新行有点棘手。你可以这样做：

$( document ).ready(function() {
    var interval;

    function run(skipFade) {
        $('#table').empty();
        $.ajax({
            type: 'POST',
            url: 'check_current_requests2.php',
            data: $('#departcount').serialize(),
            dataType: "json", 
            success: function (data) {
                if (data) {
                    var len = data.length;
                    var txt = "";
                    var style = "";
                    if (!skipFade) {
                        style = ' style="display: none;"';
                    }
                    if (len > 0) {
                        for (var i = 0; i < len; i++) {
                            if (data[i].Department && data[i].DepartCount) {
                                txt += "<tr"+ style + "><td>" + data[i].Department + "</td><td>" + data[i].DepartCount + " </td></tr>";
                            }
                        }
                        if (txt != "") {
                            $("#table").append(txt);
                        }
                        if (!skipFade) {
                            $("#table .fader").fadeIn(function() {
                                $(this).removeClass("fader");
                            });
                        }
                    }
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                alert('error: ' + textStatus + ': ' + errorThrown);
                // cancel interval if getting an error so you don't get repeated errors
                clearInterval(interval);
            }   
        });
    }

    // run it initially
    run(true);

    // run it every 30 seconds
    interval = setInterval(run, 30 * 1000);
});

这是在更简单的环境中演示fadeIn概念：http://jsfiddle.net/jfriend00/p3fts2n4/

在页面上运行功能就绪并每30秒重新运行一次

1 个答案: