jquery - Jquery Ajax HTTP 发布

Question

我需要在提交表单时执行静默帖子。然后应该将该帖子的结果加载到 div 中。该帖子运行良好，但浏览器将用户重定向到发布的页面，而不是将该页面静默加载到 div 中。这是代码...

 $('#task_details_form').submit(function() {
            // Submit AJAX request
        $.ajax({
                url      : $(this).attr('action'),
                type     : 'post',
                data     : $(this).serialize(),
                cache    : false,
                success  : function(data) {
                        $('#user_tasks').html(data);    
                    }

                });
         return false;
     });

我一直在玩语法一段时间但没有成功。有任何想法吗？

我在有和没有 e 的情况下都试过这个，但仍然没有运气。

$('#task_details_form').click(function(e) {
        e.preventDefault();
            // Submit AJAX request
        $.ajax({
                url      : $(this).attr('action'),
                type     : 'post',
                data     : $(this).serialize(),
                cache    : false,
                dataType : 'json',
                success  : function(data) {
                        $('#user_tasks').html(data);    
                    }

                });
         return false;
     });

Answer 1

您需要告诉 ajax 请求的 ContentType。添加内容类型

向服务器发送数据时，使用此内容类型。默认为“application/x-www-form-urlencoded; charset=UTF-8”，在大多数情况下都可以。如果您明确地将内容类型传递给 $.ajax()，那么它将始终被发送到服务器（即使没有发送数据）。如果没有指定字符集，数据将使用服务器的默认字符集传输到服务器；您必须在服务器端对此进行适当解码。

contentType:"Application/JSON"

Answer 2

您需要防止表单提交的默认操作。通常，当您提交表单时，浏览器会从当前页面重定向到目标页面。

你需要改变：

$('#task_details_form').submit(function() {

至

$('#task_details_form').submit(function(e) {

然后在函数的第一行添加以下内容：

e.preventDefault();

Answer 3

尝试，使用其中的 ajax 发布代码创建一个函数并在单击按钮时调用

例子

function PostMe(){
    var myForm = $('form#id_of_your_form');

      $.ajax({
        url      : myForm.attr('action'),
        type     : 'post',
        data     : myForm.serialize(),
        cache    : false,
        success  : function(data) {
                        $('#user_tasks').html(data);    
                    }

      });
}

和按钮

<button onclick="PostMe();">Async Post</button>