Question

我有这个

“fsField”是表单中所有元素的类。因此，每当用户模糊到另一个字段时，它使用函数autosave（）提交表单 - 如下所示。它会在用户模糊时保存数据，但是当用户单击“save_secL”类的按钮转到下一页时它不会保存。

$('.fsField').bind('blur', function()
 {
autosave();
 }

 });

但是当我使用此代码时

$('.save_secL').click(function()
{
 var buttonid = this.id;
{

                    var answer = confirm("You have left some questions unanswered. Click OK if you are sure to leave this section? \\n Click CANCEL if you want stay in this section. ");
    if(!answer)
    {
    var spl_items = valid().split(',');
    $(spl_items[0]).focus();

return false;
  }
else
{
        $('#hidden_agree').append('<input id="secLuseragreed" name="secL_user_agreed" value="unanswered" type="hidden" />');
    autosave();
    window.location= buttonid+".php"
        }
    }
    else
    {
    $('#hidden_agree').append('<input id="secLuseragreed" name="secL_user_agreed" value="answered all" type="hidden" />');
    autosave();
    window.location= buttonid+".php"
    }
}
  });

** autosave_secL.php是保存数据库中数据的php源。我独立运行它确实可以保存数据。 **

function autosave()
{
var secL_partA_ques_1_select = $('[name="secL_partA_ques_1_select"]').val();
var secL_partA_ques_1 = $('[name="secL_partA_ques_1"]:checked').val();
var secL_partA_ques_2_select = $('[name="secL_partA_ques_2_select"]').val();


$.ajax(
    {
    type: "POST",
    url: "autosave_secL.php",
    data: "secL_partA_ques_1_select=" + secL_partA_ques_1_select + "&secL_partA_ques_1=" + secL_partA_ques_1 + "&user_id=<?php echo $row_token[user_id]?>" + "&updated_by=<?php echo $member."-".$key;?>",
        cache: false,
    success: function()
    {    
    $("#timestamp").empty().append('Data Saved Successfully!');
    }

    });

}

**

valid（）是一个验证函数，用于检查是否有任何字段为空，如果有空字段则返回值。**

 function valid()
{

    var items = '';
    $('.fsField').each(function() 
    {

        var thisname = $(this).attr('name')
        if($(this).is('select'))
        {
            if($(this).val()=='')
            {
                var thisid = $(this).attr('id')
                items += "#\"+thisid+\",";
                $('[name=\"'+thisname+'\"]').closest('td').css('background-color', '#B5EAAA');
            }
        }
        else
        {
            $('[name=\"'+thisname+'\"]').closest('td').css('background-color', '');
        }
    });

    return items;
}

有人可以帮忙吗？我现在被困了一天。无法理解为什么它会在用户进入字段时保存，但在单击按钮并进行验证时不保存。用Firefox测试。单击按钮（save_secL类）时，此行显示为红色，旁边有十字标记。我正在使用ssl连接。

POST https://example.com/files/autosave_secL.php   x

以下是尝试实施解决方案的修改后的代码

$('#submit_survey_secL').click(function()
{

    if(valid() !='')
    {
         var answer = confirm("You have left some questions unanswered. Are you sure you want to Submit and go to Section B? ");
         if(!answer)
        {
               var spl_items = valid().split(',');
               $(spl_items[0]).focus();

               return false;
        }
          else
        {
            $('#hidden_agree').append('<input id=\"secLuseragreed\" name=\"secL_user_agreed\" value=\"unanswered\" type=\"hidden\" />');

            autosave(function(){
                window.location= "part1secM.php?token=1&id=4"
            });
        }
    }
    else
    {
        $('#hidden_agree').append('<input id=\"secLuseragreed\" name=\"secL_user_agreed\" value=\"unanswered\" type=\"hidden\" />');

        autosave(function(){
            window.location= "part1secM.php?token=1&id=6"
        });
    }
});


function autosave(callback)
{

    var secL_partL_ques_1_select = $('[name="secL_partL_ques_1_select"]').val();
    var secL_partL_ques_1 = $('[name="secL_partL_ques_1"]:checked').val();
    var secL_partL_ques_2_select = $('[name="secL_partL_ques_2_select"]').val();


    $.ajax(
    {

    type: "POST",
    url: "autosave_secL.php",
    data: "secL_partL_ques_1_select=" + secL_partL_ques_1_select + "&secL_partL_ques_1=" + secL_partL_ques_1 + "&user_id=<?php echo $row_token[user_id]?>" + "&updated_by=<?php echo $member."-".$key;?>",
        cache: false,
    success: function()
        {    
             $("#timestamp").empty().append('Data Saved Successfully!');

                     if($.isFunction(callback))
         {                  
            callback();
         }
        }

    });

}

我不明白为什么这不起作用，因为回调应该完全奏效。 Firebug不再显示红色的POST https://example.com/files/autosave_secL.php，但它显示已发布，但我认为回调由于某种原因没有触发

Answer 1

$('.save_secL').click(function() {

//...

//start autosave. Note: Async, returns immediately
autosave();
//and now, before the POST request has been completed, we change location...
window.location= buttonid+".php?token=$row_token[survey_token]&$member=$key&agr=1"
//....and the POST request gets aborted :(

解决方案：

function autosave(callback)
{
//...
$.ajax(
    {
//...
    success: function()
    {    
        $("#timestamp").empty().append('Data Saved Successfully!');
        if($.isFunction(callback)) 
            callback();
    }
    });
}

//and

autosave(function(){
    window.location= buttonid+".php?token=$row_token[survey_token]&$member=$key&agr=1"
});

顺便说一句，您的自动保存功能对您的服务器来说非常困难。您是否考虑过使用localStorage +包含所有数据的最终POST请求？

Answer 2

我得到了解决方案。

它可能是其中之一。 scr4ve的解决方案肯定有帮助。所以这就是我认为它现在正在起作用的要点。

移动了“cache：false”，并在url：之前删除了“async：false”在ajax自动保存功能中。之前我把它放在“数据：”之后。
在autosave_secL.php /？“+ Match.random（）
添加了scr4ve的解决方案，以便在重定向之前完成POST

单击按钮并运行$ .ajax函数时，php mysql不保存数据

2 个答案: