Question

我最近开始学习Ajax和jQuery。所以昨天我开始为一个公式编写一个简单的ajax请求，它将一个选择列表值发送到一个php脚本并从数据库中读取一些内容。

它到目前为止工作！但问题是，当我点击发送按钮时，它会在1秒后启动请求。我知道这与我的间隔有关。当我点击发送按钮时，我会启动请求，并且每秒都会请求它，这样我就有机会自动刷新新的收入条目。

但是我希望每秒都有一个间隔周期，但是第一次按下按钮它应该立即加载，而不是仅仅1秒钟。

这是我的代码： http://jsbin.com/qitojawuva/1/edit

$(document).ready(function () {

    var interval = 0;
    $("#form1").submit(function () {

        if (interval === 0) {
            interval = setInterval(function () {


                var url = "tbladen.php";
                var data = $("#form1").serialize();

                $.ajax({
                    type: "POST",
                    url: url,
                    data: data,
                    success: function (data) {
                        $("#tbladen").html(data);
                    }
                });
            }, 1000);
        }
        return false;
    });


});

谢谢！

Answer 1

我可能会像您正在寻找的以下内容。

$(document).ready(function () {

    var isFirstTime = true;

    function sendForm() {
        var url = "tbladen.php";
        var data = $("#form1").serialize();

        $.ajax({
            type: "POST",
            url: url,
            data: data,
            success: function (data) {
                $("#tbladen").html(data);
            }
        });

    }

    $("#form1").submit(function () {

        if (isFirstTime) {
            sendForm();
            isFirstTime = false;
        } else {
            setTimeout(function () {
                sendForm();
            }, 1000);
        }
        return false;
    });

});

Answer 2

所以，当回调结束时使用setTimeout，setInterval只要你的回调完成就继续运行。

$(function () {

    $("#form1").submit(postData);

    function postData() {
        var url = "tbladen.php",
            data = $("#form1").serialize();        
        $.ajax({
            type: "POST",
            url: url,
            data: data,
            success: function (data) {
                $("#tbladen").html(data);
                setTimeout(postData, 1000);
            }
        });
        return false;
    }
});

有点related demo

带间隔的简单ajax请求

2 个答案: