使用 jquery 和 ajax 自动保存表单字段输入

Question

我有一个表单，有不同的输入字段。所以非常分钟，用户输入的数据需要自动存储在数据库中。提交请求后，它将被定向到将执行数据库交互的 struts 文件。

我已经尝试过，我已经设置了每次加载页面时运行的超时功能

var timer;
$(document).ready(function() {
timer = setTimeout("autosave()", 60000); 
});

在自动保存功能中，我正在尝试将输入数据发布到指定的 URL

jQuery('form').each(function() {
        jQuery.ajax({
            url: "http://localhost:7002/submitStudent.do?requestType=auto&autosave=true",
            data: jQuery(this).serialize(),
            type: 'POST',
            success: function(data){
                if(data && data == 'success') {
                    alert("data saved");
                }else{
                }
            }
        }); 
    }); 
}
 }

并且一旦请求发送到struts，就会根据requesttype进行处理并提交数据。

但在我的情况下，数据没有被保存。

请分享您对我做错了什么以及任何其他方法的建议？

感谢您宝贵的建议和时间..

仅供参考，我是 Jquery 和 ajax 技术的初学者

JSFIDDLE：jsfiddle

Answer 1

我根据你的要求做了一个fiddle。

var timer;

var fun = function autosave() {
    alert();
    jQuery('form').each(function () {
        jQuery.ajax({
            url: "http://localhost:7002/submitStudent.do?autosave=true",
            data: jQuery(this).serialize(),
            type: 'POST',
            success: function (data) {
                if (data && data == 'success') {
                    alert("data saved");
                } else {}
            }
        });
    });
}
$(document).ready(function () {
    setTimeout(fun, 1000);
    //setInterval(fun,1000);
});

您需要关注setTimeout 和setInterval 两种方法。 setTimeout 将在 DOM 加载 1 秒后调用 autosave()，但只会调用一次。 setInterval 将在每 1 秒后重复调用 autosave()。你可以阅读它here。

setTimeout() 方法调用函数或计算表达式 在指定的毫秒数之后。 提示：该函数只执行一次。如果需要重复执行，请使用setInterval() 方法。

有关您的 ajax 请求的更多详细信息，您需要查看控制台（F12）错误。

Answer 2

我推荐你使用ajaxForm插件

并在自动保存功能中触发 $('form').submit();

这个方法又快又好