web-dev-qa-db-ja.com

メッセージが表示された後にページを再読み込みする、jQuery

現在、ユーザーが情報を入力するフォームがあります。これは、jQuery ajax関数によって処理され、return false;に設定されているため、ユーザーがフォームを送信した後にページが再ロードされることはありません。ページを再読み込みする必要がありますが、return false;を削除すると、成功メッセージが表示される前にページが更新されます（このメッセージは、ユーザーがデータを送信した後に表示されます）。

     $.ajax({
      type: "POST",
      url: "scripts/process.php",
      data: dataString,
      success: function() {
       $("#st_message").html("<p> Your article was successfully added!</p>");
       //I need to reload page after the above message is shown
      }
     });
    return false;

では、<p> Your article was successfully added!</p>メッセージが表示された後にページをリロードするにはどうすればよいですか。ユーザーが実際にメッセージを読むことができるように、2〜3秒程度のわずかな遅延があります。

jqueryajaxreload
16
Ilja

次のような setTimeout() 関数を使用して遅延を追加できます。

// This will reload the page after a delay of 3 seconds
window.setTimeout(function(){location.reload()},3000)

あなたのニーズのために：

$.ajax({
      type: "POST",
      url: "scripts/process.php",
      data: dataString,
      success: function() {
           $("#st_message").html("<p> Your article was successfully added!</p>");
           window.setTimeout(function(){location.reload()},3000)
      }
});
return false;

実施例

34
Rion Williams

次のようなものでそれを行います：

_function delayedRedirect(){
    window.location = "/index.php"
}

setTimeout('delayedRedirect()', 3000)
_

setTimeoutは、リダイレクト関数の呼び出しを遅らせるために使用されます。この場合、どこかを新しいURLにリダイレクトできます（必要な場合に備えて）。

それ以外の場合は、location.reload()を使用してページを再読み込みします。

4
Jakub

setTimeoutメソッドを使用して遅延を取得し、reloadメソッドを使用してページをリロードします。 true呼び出しのreloadパラメーターに注意して、ページがキャッシュから再描画されるだけでなく、実際に再ロードされることを確認してください。

window.setTimeout(
  function(){
    location.reload(true)
  },
  3000
);
3
Guffa

JavaScriptのwindow.location.reload()のような意味ですか？

2
David Laberge

それを使って与える

setTimeout("window.location='yourpage.php'",3000);

あなたのコードで：

 $.ajax({
       type: "POST",
       url: "scripts/process.php",
       data: dataString,
       success: function() {
        $("#st_message").html("<p> Your article was successfully added!</p>");
        setTimeout("window.location='yourpage.php'",3000);//reload after 3 sec.
       }
      });
 return false;
2
mithunsatheesh

タイムアウトの使用は本当に悪い考えです。

2
chuckfinley
 $.ajax({
  type: "POST",
  url: "scripts/process.php",
  data: dataString,
  success: function() {
  var miliseconds = 2000;

   $("#st_message").html("<p> Your article was successfully added!</p>");
   setTimeout("window.location=window.location", miliseconds);
   //I need to reload page after the above message is shown
  }
 });
1
jlrvpuma
<script type="text/javascript">
 //
 //your action here
 //
 window.setTimeout(function(){self.parent.location="?list"},3000);//after 3 sec go to (?list or example.html page)
 return false;
</script>
1
Maher