1

.post()含まれているページをポストバックせずに jQuery のメソッドを使用することについて質問があります。

これは、図書館システムの書籍ページのコードです。ユーザーが [Return book] ボタンをクリックすると、jQuery を使用.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()メソッドを使用してページをポストバックするのを避け、ページの必要な部分だけを変更するか、または
  • 前のページに直接戻るように [戻る] ボタンを修正しますか?

ありがとう！

4

4 に答える 4

1

実際には、クリック機能が起動し、さらにデフォルトの機能 (「送信」ボタンが押されたときにフォームを送信する) が発生している可能性があります。

これを防ぐには、ボタンを送信ボタンではなくプレーン ボタンにするかreturn false、クリック機能の最後に追加します。または、jQuery のevent.stopPropagation()を見てください。

于 2011-01-06T17:36:06.940 に答える
1

jQuery イベント ハンドラーの末尾に追加return falseすると、デフォルトのイベント ハンドラーが実行されなくなります。あなたの場合、フォームを送信するデフォルトの動作は POST を実行することなので、それが起こります。

于 2011-01-06T17:36:36.277 に答える
0

関数の最後に return false を追加

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

});
于 2011-01-06T17:34:26.740 に答える
0

return false;クリック機能を入れてみてください。おそらく、実際にページを送信していて、非同期に進むのではありません。それがうまくいかない場合、あなたの ajax ページはどのように見えますか?

于 2011-01-06T17:35:18.437 に答える