jQueryを使用してページを一度更新(リロード)しますか?


82

jQueryを使用してページ(または特定のdiv)を一度(!)更新/再読み込みする方法を知りたいですか?

理想的な方法で、右後DOM structure(参照、利用可能であるonload場合)とマイナス影響を与えないback buttonbookmarkの機能。

注意:replace() サードパーティの制限により許可されていません。


私はあなたの質問に何かが欠けています。ページを「更新」するとはどういう意味ですか。ページが読み込まれた場合、すぐに再読み込みすると、まったく同じコンテンツが読み込まれます。何を達成しようとしていますか?
Doug Neiner 2010

私は「通常」最初に表示されるテンプレートに取り組んでいますが、更新/再読み込みするとiFrameに強制されます。ここで、最初の「呼び出し」でもそのiFrameにページを表示したいと思います。TIA!
ピート

この記事を読むべきだと思います
mycodingtricks.com/snippets/javascript/…– Shubham Kumar

回答:


81

さて、私はあなたが求めているものを手に入れたと思います。これを試して

if(window.top==window) {
    // You're not in a frame, so you reload the site.
    window.setTimeout('location.reload()', 3000); //Reloads after three seconds
}
else {
    //You're inside a frame, so you stop reloading.
}

一度なら、

$('#div-id').triggerevent(function(){
    $('#div-id').html(newContent);
});

定期的な場合

function updateDiv(){
    //Get new content through Ajax
    ...
    $('#div-id').html(newContent);
}

setInterval(updateDiv, 5000); // That's five seconds

したがって、5秒ごとにdiv#div-idコンテンツが更新されます。ページ全体を更新するよりも優れています。


ありがとうございますが、ページを1回だけ更新/再読み込みしたい(可能であればブラウザセッションごとに)...?
ピート

リロードのトリガーは何ですか?特定のイベントまたはちょうど時間?
ベン

トリガー:ページの最初の「呼び出し」(申し訳ありませんが、私の英語はちょっと貧弱ですg
ピート

omfgroflmao、あなたは天才です!「編集された」バージョンはまさに私が探していたものです(一日中...)。ここにオプションのタイムトリガーを追加することは可能ですか?そのため、location.reloadが実行されます-たとえば-3秒後に...?TIA(あなたは本当に私の一日を作りました!)
ピート

ええ、確かに、window.setTimeout( 'location.reload()'、3000);でlocation.reload()を変更するだけです。
ベン

66

リロードするには、これを試すことができます:

window.location.reload(true);

1
ブール引数を説明できますか?
tomfumb 2011年

7
location.reload関数の引数は、ブラウザーがWebサーバーからドキュメントを取得する必要があるかどうかを決定します。Webサーバーからドキュメントを再度プルする必要がある場合(ドキュメントの内容が動的に変更される場合など)、引数を「true」として渡します 。grizzlyweb.com/ webmaster / javascripts / refresh.asp
秘密


5

これを使って:

    <script type="text/javascript">
        $(document).ready(function(){

            // Check if the current URL contains '#'
            if(document.URL.indexOf("#")==-1)
            {
                // Set the URL to whatever it was plus "#".
                url = document.URL+"#";
                location = "#";

                //Reload the page
                 location.reload(true);
            }
        });
    </script>

if条件により、ページは1回だけリロードされます。


4
$('#div-id').click(function(){

   location.reload();
        });

これは正しい構文です。

$('#div-id').html(newContent); //This doesnt work

3

これはJavaScriptの基本であるため、jQuery更新関数はありません。

これを試して:

<body onload="if (location.href.indexOf('reload')==-1) location.replace(location.href+'?reload');">

良いですね。関数内に配置することもできます:<body onload = "javascript:init()">および関数init(){if(location.href.indexOf( 'reload')==-1)location.replace(location。 href + '&reload');}
Adrian P.

2

使用する:

<html>
    <head>
        <title>Reload (Refresh) Page Using Jquery</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                $('#reload').click(function() {
                    window.location.reload();
                });
            });
        </script>
    </head>
    <body>
        <button id="reload" >Reload (Refresh) Page Using</button>
    </body>
</html>

1

これをファイルの先頭に追加すると、サイトは30秒ごとに更新されます。

<script type="text/javascript">
    window.onload = Refresh;

    function Refresh() {
        setTimeout("refreshPage();", 30000);
    }
    function refreshPage() {
        window.location = location.href;
    }
</script>

もう1つは:headタグを追加する

<meta http-equiv="refresh" content="30">

1
 - location = location
 - location = location.href
 - location = window.location
 - location = self.location
 - location = window.location.href
 - location = self.location.href
 - location = location['href']
 - location = window['location']
 - location = window['location'].href
 - location = window['location']['href']

これにはjQueryは必要ありません。JavaScriptでそれを行うことができます。


0

代わりにこれを使用してください

function timedRefresh(timeoutPeriod) {
    setTimeout("location.reload(true);",timeoutPeriod);
}

<a href="javascript:timedRefresh(2000)">image</a>

0

このコードを試してください:

$('#iframe').attr('src', $('#iframe').attr('src'));

0

これを試して:

<input type="button" value="Reload" onClick="history.go(0)">


0

これthislocation.reload()チェックするとともに参照を使用する必要があるかもしれません、それは動作します。

this.location.reload();
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.