0

我一直在尝试尽可能多地找出在没有页面请求的情况下提交表单的最佳方式，这意味着表单会自动上传到数据库而无需重新加载页面。在这种情况下，我想知道性能方面的知识。

注意：Stackoverflow 上有很多帖子回答了这个问题，尽管不是我问的具体内容。

我知道的只有三种方法是使用 JavaScript、AJAX 和 jQuery。以下两者的示例。

JavaScript：

$(document).ready(function(){
        submit_form();
});

function submit_form () {
    $.post('process.php', $("#myform").serialize(), function(data) {
        $('#results').html(data);
    });
}

阿贾克斯：

            $.ajax
                ({
                type: "POST",
                url: "file.php",
                data: ,
                cache: ,
                success: function (html)
                    {
                        alert("Order Submitted");
                    }
                });

jQuery：

$('#myform').submit(function()
{
    $('#myform').ajaxForm();
    return false;
});

有没有更好的方法来实现这一点？如果是这样，包括我上面提到的 JavaScript、AJAX 和 jQuery，哪个更好？哪个更快？

4

4 回答 4

1

好吧，这取决于您的 api，我的意思是您在哪里提交数据，在许多地方您会发现您可能必须将您的代码与某人的后端代码集成。总是最好传递后端要求的信息，例如如果您必须创建一个疯狂的组件（如绘图画布或其他东西），并将其状态保存在后端，以上述任何方式都无法做到。除非您正在创建元素来存储画布状态。所以在我看来使用 JS Object 是最好的，因为你可以发送我的后端需要的东西，而不是别的。

$.ajax( {
  type: 'POST',
  url: file.php,
  data: {'key':'value'},// key should be exactly same as backend API demands it.
              // value should be in exactly same formate as API demands it.                           success: function(data) {
            $('#message').html(data); // Here is a success message you can replace it according to your desire.
        }
    } );
}
于 2013-06-30T19:37:05.713 回答
1

我正在使用这个 Js AJAX 表单提交功能，因为他非常通用：

function submitForm(form_id, response_id, url, callback)
{
    $(document).ready(function()
    {
        if (!url)
            url = window.location.href;


        var form_data = $('#'+form_id).serialize();
        $.ajax({
            type: "POST",
            url: url,
            data: form_data,
            success: function(msg) 
            {
                $("#"+response_id).html(msg);

                if(callback)
                    callback();
            }
        });
    });
}

只需在您的页面中创建空 div，例如提交：

  ...
  Your page content..
  <div id="submit"></div>
</body>

当您需要在同一页面中提交表单时：

submitForm('form_id', 'submit');

在其他页面：

submitForm('form_id', 'submit', 'My page url');

如果您需要在同一页面中的 js 回调：

submitForm('form_id', 'submit', false, function(){ doSemethingAfterSubmit(); });

或者在其他页面

submitForm('form_id', 'submit', 'My page url', function(){ doSemethingAfterSubmit(); });

你的PHP文件可以输出js代码，可以警告用户错误等等......

于 2013-06-30T19:22:46.290 回答
1

最好的方法是使用Ajax

 $.ajax( {
            type: 'POST',
            url: file.php,
            data: $("#form_id").serialize(), // form.serialize takes all the values of your input elements 
            success: function(data) {
                $('#message').html(data); // Here is a success message you can replace it according to your desire.
            }
        } );
    }
于 2013-06-30T19:23:46.640 回答
1

方法1使用页面提交
方法1和2使用ajax

为了防止页面在表单提交时更改/重定向，您需要使用ajax，当通过它完成通信时，页面不受影响，您可以选择提供一个回调函数来处理服务器发回的数据。

-Relfor

于 2013-06-30T19:29:02.177 回答