jQuery: не перегружать страницу с помощью метода .post()?

Question

У меня есть вопрос об использовании метода jQuery's .post(), не отправляя обратно содержащую страницу.

Это код для страницы книги в библиотечной системе. Если пользователь нажимает кнопку «Возврат книги», я использую jQuery's .post() для установки книги, возвращенной в базе данных.

<form id="checkoutform"> 
<input type="submit" id="checkout" class="button" value="Return book" /> 
</form> 
$(document).ready(function(){ 
    $("#checkout").click(function() { 
    $.post('/transaction/', { book_id: '{{ book.id }}', user_id: username }, function(data) { 
     alert(data); 
     }); 
    }); 
}); 

Операции с транзакциями по базе данных находят, но также заходят на страницу назад.

Это не проблема сама по себе, но она изменяет поведение кнопки «Назад» - и это проблема. Если пользователь нажимает «Вернуть книгу», а затем использует кнопку «Назад» в браузере, они будут видеть страницу книги, как это было до того, как они вернут книгу, так что будет выглядеть так, как будто книга все еще проверена.

есть способ либо:

• избегают размещения обратно на страницу с помощью метода JQuery .post(), и просто изменить части страницы, что мне нужно, или
• подправить кнопку Назад так он возвращается к предыдущей странице?

Спасибо!

Answer 1

На самом деле, вероятно, происходит то, что функция щелчка стреляет, а затем, кроме того, функция по умолчанию (отправьте форму при нажатии кнопки «отправить»).

Чтобы предотвратить это, сделайте кнопку простой кнопкой вместо кнопки отправки или добавьте return false в конце вашей функции щелчка. Или взгляните на jQuery's event.stopPropagation().

Answer 2

добавить вернуть ложна в конце функции

$(document).ready(function(){ 
    $("#checkout").click(function() { 
    $.post('/transaction/', { book_id: '{{ book.id }}', user_id: username }, function(data) { 
     alert(data); 
     }); 
    return false; 
    }); 

}); 

Answer 3

Попробуйте бросать return false; в функции мыши. Возможно, он действительно отправляет страницу и вместо нее идет асинхронно. Если это не сработает, как выглядит ваша страница ajax?

Answer 4

Добавление return false в конец обработчика события jQuery предотвратит выполнение обработчика события по умолчанию. Поскольку в вашем случае поведение по умолчанию для отправки формы - это сделать POST, вот что происходит.