Question

我目前正在通过Ajax将数据添加到db表中，如下所示：当用户按下id为#submit_btn的按钮时，它会触发以下函数并发布数据。函数代码看起来像这样。

$("#submit_btn").click(function () {
    $("#add_form").submit(function (e) {
        e.preventDefault();
        dataString = $("#add_form").serialize();
        $.ajax({
            type: "POST",
            url: "processor/dbadd.php",
            data: dataString,
            dataType: "json",
            success: function (result, status, xResponse) {
                //do something if ajax call is success
                var message = result.msg;
                var err = result.err;
                if (message != null) {
                    $.notifyBar({ cls: "success", html: message });
                }
                if (err != null) {
                      $.notifyBar({ cls: "error", html:err});
                }
            },
            error: function (e) {
                //ajax call failed
                alert(e);
            }
        });
    });

无论如何都要修改此代码以便每2-3秒自动提交一次？（自动保存）

Answer 1

请尝试此代码

<script>

    $(document).ready(function(){
        var int = window.setInterval("call();",2000);
            $("#add_form").submit(function (e) {
                  // PLACE YOUR SUBMIT CODE HERE
            });

            $("#submit_btn").click(function () {
                  $('#add_form').submit();
            }); 
    });

    function call(){
        $('#add_form').submit();
    }

    </script>

/// NEW ANSWER

<script>
    var int;

    $(document).ready(function(){

            $("#add_form").submit(function (e) {
                  // PLACE YOUR SUBMIT CODE HERE
            });

            $("#submit_btn").click(function () {
                  int = window.clearInterval(int)
                  int = window.setInterval("call();",3000);
            }); 
    });

    function call(){
        $('#add_form').submit();
    }

</script>

///第三回答

<script>
    $(document).ready(function(){

            $("#add_form").submit(function (e) {
                  // PLACE YOUR SUBMIT CODE HERE
              });

             $("#submit_btn").click(function () {
                   int = window.setInterval("call();",3000);
                   $(this).attr({'disabled':'disabled'});
                   $(':input#autosave').attr({'disabled':'disabled'});
            }); 

            $(':input#autosave').click(function(){
                if($(this).is(':checked')){
                    $(':input#submit_btn').attr({'value':'Save & exit'});
                }
                else{
                    $(':input#submit_btn').attr({'value':'Save'});
                }
            });
    });

    function call(){
        $('#add_form').submit();
    }
</script>


</head>

<body>
<form id="add_form" action="" method="post">
<input type="checkbox" id="autosave" value="1"/>
<input id="submit_btn" type="submit" name="save" value="Save"/>

</form>
</body>

Answer 2

要考虑使用setTimeout而不是setInterval，而不是{{1}}，只需要调用一次。

Answer 3

一种可能的解决方案是将$('#add_form')的内容放在单独的函数中，例如submt()，并在setTimeout上调用提交，或者点击$('#submit_btn')。

Ajax自动保存功能

3 个答案: