webpageユーザー情報を表示する があります。ajaxユーザーがWebページを変更せずにこのデータを変更できるようにするために使用しています。
構造は実にシンプルです:
- ユーザーがプロファイルに移動すると、データが表示されます。
-ユーザーが [編集] ボタンをクリックすると、データを変更するためのフォームが表示されます。
- ユーザーがフォームを送信すると、データが保存され、静的データが再び表示されます (更新されます)。ユーザーがボタンを使用して編集ページに戻れないようにする必要があります。Back
-ユーザーが編集中にクリックして戻ると、静的データが再び表示されます。
-ユーザーが静的データを表示しているときにクリックして戻る場合は、常に前のページ (プロファイルではなく) に戻る必要があります。
ボタンのクリックHTML5 History APIを処理するために使用しています。Backユーザーがデータを送信するときに問題が発生します。これは、ユーザーが前の状態 (編集ではなく) に戻ることができないようにするためです。これは私が今やっていることです：
// Edit button clicked.
function edit1(){
history.pushState("edit", null, "");
showForm();
}
window.addEventListener("popstate", function(e) {
var HistoryState = history.state;
if(HistoryState == null){
showStaticData();
}
else if(HistoryState == "edit1"){
showForm();
}
});
$('#myForm').submit(function () {
...
history.back(); // CODE TO DO WHEN THE FORM HAS BEEN SUBMITTED
return false;
});
上記のコードで行っているように history.back() を使用すると、ユーザーがForwardボタンをクリックできるという事実を除いて、すべて正常に機能します。replaceState または pushState を使用すると、Forwardボタンは無効になりますが、ユーザーはBackボタンをクリックして同じページにとどまることができます (それは望ましくありません)。
Forward新しい状態を追加せずにボタンを無効にする方法はありますか? Back（ユーザーがクリックして同じページにとどまることを望まない）