每隔x秒触发一次功能

时间:2016-02-27 00:53:51

标签: javascript ajax

我目前正在使用keyup函数来启动我的autosave.php文件,该文件会自动将信息保存到表中。但是,我开始发现由于快速键入和提交长字符串,密钥似乎效率低下。

如何在每隔x秒后提交ajax,而不是在这么多ms后提交每个keyup?

$(document).ready(function()
{
    // Handle Auto Save
    $('.autosaveEdit').keyup(function() {
        delay(function() {
            $.ajax({
                type: "post",
                url: "autosave.php",
                data: $('#ajaxForm').serialize(),
                success: function(data) {
                    console.log('success!');
                }
            });
        }, 500 );
    });
});
var delay = (function() {
    var timer = 0;
    return function(callback, ms) {
        clearTimeout (timer);
        timer = setTimeout(callback, ms);
    };
})();

3 个答案:

答案 0 :(得分:2)

解决方案

使用setInterval它就像setTimeout但重复自己。

setInterval(function () {
    $.ajax({
        type: "post",
        url: "autosave.php",
        data: $('#ajaxForm').serialize(),
        success: function(data) {
            console.log('success!');
        }
    });
}, 1000);

优化

控件有焦点时将其打开,焦点离开时将其关闭。如果表单数据已更新,则还轮询表单数据,然后发送ajax请求,否则忽略它。

var saveToken;
var save = (function () {
    var form;
    return function () {
        var form2 = $('#ajaxForm').serialize();
        if (form !== form2) { // the form has updated
            form = form2;
            $.ajax({
                type: "post",
                url: "autosave.php",
                data: form,
                success: function(data) {
                    console.log('success!');
                }
            });
        }
    }
}());

$('.autosaveEdit').focus(function() {
    saveToken = setInterval(save, 1000);
});
$('.autosaveEdit').focusout(function() {
    clearInterval(saveToken);
    save(); // one last time
});

答案 1 :(得分:1)

我相信你要找的是window.setInterval函数。它是这样用的:

setInterval(function() { console.log('3 seconds later!'); }, 3000);

答案 2 :(得分:1)

使用setInterval

function goSaveIt()
{
    $.ajax({
        type: "post",
        url: "autosave.php",
        data: $('#ajaxForm').serialize(),
        success: function(data) {
            console.log('success!');
        }
    });
}

setInterval(goSaveIt, 5000); // 5000 for every 5 seconds