0

jQuery を使用して Div のコンテンツを別の PHP ファイルに変更する方法 - ハイパーリンクの使用 - ページの更新なし

statsdiv の ID を持つ div があるとしましょう

次に、これらのページがあるとしましょう:

page1.php page2.php page3.php

そして3リンク。

ページ1 | ページ2 | ページ3

ドキュメントが最初に開かれたときに page1 をプリロードする必要があり、ページを更新せずにページの 1 div 内で page1、page2、または page3 に変更できる必要があります。

また、5 秒ごとに更新する div も必要です。

どうすればこれを達成できますか?

4

2 に答える 2

1

iframeを使用できます。これは、それほど手間をかけずに完全なページを読み込むことができるボックスです。

ただし、AJAXを使用することをお勧めします。ユーザーがあなたのリンクをクリックするたびに、jqueryを使用してjavascript関数を作成します。

$（'＃statsdiv'）。load（'page1.html'）;

私が正しく覚えていれば、これはページ全体をリロードするのではなく、あなたのdivだけをリロードするはずです。現在コードを試すことができないので、間違っている場合はお知らせください。

于 2012-07-19T16:56:55.167 に答える
0

これを試してみてください。あなたの div には統計 (#stats) の ID があり、ページには page1.php、page2.php、page3.php などのリンクがあると思います。最初に page1.php をロードし、後で onclick イベントによってページが変更されます。

<!DOCTYPE html>
 <html lang="en">
 <head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
    $(function(){

        // for initial load
        pageUrl = 'page1.php';
        // after clicking links
        $('#page2').click(function(){
            pageUrl = 'page2.php';
            LoadingPages(pageUrl);
        })

        $('#page3').click(function(){
            pageUrl = 'page3.php';
            LoadingPages(pageUrl);
        })

        $('#page1').click(function(){
            pageUrl = 'page1.php';
            LoadingPages(pageUrl);
        })

        function LoadingPages(pageUrl)
        {
            $('#stats').load(pageUrl);
        }
        int = setInterval(function(){
            LoadingPages(pageUrl)
        },5000);

    })
</script>
  </head>
  <body>
<div id="stats"></div>

<a href="#" id="page1"> Page 1</a>
<a href="#" id="page2"> Page 2</a>
<a href="#" id="page3"> Page 3</a>

  </body>
  </html>
于 2012-07-19T17:03:54.947 に答える