2015-10-23 25 views
6

私はウェブページを更新しています。ユーザーアクションに基づいてurlパラメータが更新されます。 ユーザーがフィルタをクリックして更新した商品が表示されたときにURLが変更されるEコマースのシナリオを考えてみましょう。ブラウザのバックボタンで動的URLが変更されるパラメータ

ユーザーがブラウザの戻るボタンをクリックすると、ブラウザは以前のurl-parameterに戻りますが、ページは変更されませんでした。戻るボタンをクリックした後に変更されるurlパラメータに基づいてページを変更したい

私は、このソリューションを試してみました:

$($window).on('popstate', function (e) { 
    // Update the page also 
}); 

このコードの問題は、これはURLが変更とトリガーされます、である、ブラウザの戻るボタンをクリックするか、URLを使用して変更された場合、それは気にしないことを意味しますjQuery。したがって、ユーザーのやりとりに基づいてURLを変更している場合は、popstateコールバックが呼び出され、カスタム関数も呼び出されます。私はhttps要求を使用しているページを更新するため、http apiは2回呼び出されます。

[戻る]ボタンのみがクリックされているかどうかを確認する方法はありますか?

+0

これは参考になるかもしれません:http://stackoverflow.com/questions/18211984/how-to-control-back-button-event-in-jquery-mobile –

+0

ありがとう、それはjquery mobile用です。私はjQuery Mobileを使用していません(私はできます:) –

答えて

1

バックボタンによるURLの変更だけでなく、URLの変更を聞いて、デザインを変更してすべてのコンテンツの更新(ケースの製品リスト)をトリガーすることをお勧めします。したがって、クリックイベントの再レンダリングをトリガーする代わりに、これらのボタンをコンテンツを表すURLへの通常のリンクとし、popstateイベントから機能をトリガーさせます。

これは、Angular.js、BackboneなどのMVVMフレームワークがすべて設計され、使用される方法です。

このようにすることで、長期的にアプリケーションを管理することも非常に簡単になります。

幸運を祈る!

関連する問題