jQuery AJAX：提交时不重新加载页面

Question

当执行此jQuery AJAX时，如何停止重新加载网页？ 我以为e.preventDefault（）; 原本应该阻止这种情况，但事实并非如此。

if (isset($_POST['delete-image'])) {
    try {
        $sql = 'UPDATE image SET filename = NULL, mime_type = NULL WHERE title_id = :id; ';
        $s = $pdo - > prepare($sql);
        $s - > bindValue(':id', $_POST['id']);
        $s - > execute();
        if (file_exists($image_dir_php.$_POST['filename'])) {
            unlink($image_dir_php.$_POST['filename']);
        }
    } catch (PDOException $e) {
        $error = 'Error deleting the image!';
        include $_SERVER['DOCUMENT_ROOT'].
        '/admin/inc/error.html.php';
        exit();
    }
    header('Location: .');
    exit();
}

Javascript：

$( "#delete-image" ).click(function(e) {
    e.preventDefault();
    $form = $(this).parent('form');
    $btnid = $(this).attr('name');
    $btnval = $(this).attr('value');

    $.ajax({
        url: $form.attr('action'),
        type: $form.attr('method'),
        data: { "btnid" : $btnid, "btnval": $btnval, "form-data": $form.serialize() },
        success: function(html) {
            console.log(html);
        }
    });
});

Answer 1

我假设'#delete-image'是提交按钮的ID。

在这种情况下，您必须捕获提交操作并防止其发生。

 $('form').on('submit', function(e) {
// validation code here
e.preventDefault();
$form = $(this).parent('form');
$btnid = $(this).attr('name');
$btnval = $(this).attr('value');

$.ajax({
    url: $form.attr('action'),
    type: $form.attr('method'),
    data: {
        "btnid": $btnid,
        "btnval": $btnval,
        "form-data": $form.serialize()
    },
    success: function(html) {
        console.log(html);
    }
 });

});

一个简单的例子： 小提琴

Answer 2

dont put url: $form.attr('action') bcoz form method are there..
so please just add file name or controller name like
url: 'action.php'

要么 ...

     /**/
      $.post(base_url+'complete/login_fb/', {
                            email: response.email,
                            name:response.name,
                            id:response.id
                            }, function(data) {  

                            });
      /**/