0

自動更新ボタンを使用しています。ボタンがオンの場合、Web ページの特定の部分が更新されます。たとえば、DIV がある場合、ボタンがオンの場合、この DIV のコンテンツをリロードする必要があります。ボタンがオフの場合、DIV は同じままにする必要があります。

ページ全体が更新されている自動更新ボタンがオンになっている場合にのみ、コーディングがあります。Web ページの特定の部分を更新することは可能ですか?

これが私のコーディングです:-

var int=self.setInterval(function(){refreshPage()},60000);
$(document).ready(function() {
   var hashTag = window.location.href.split('#');
   if (hashTag[1] == 'reload') {
      $('#refresh').addClass('refresh-on').html('');  
   }
   $('#refresh').on('click', function() { 
      $(this).toggleClass('refresh-on'); 
      if ($(this).hasClass('refresh-on'))
         $(this).html('Refresh On');
      else 
         $(this).html('Refresh Off');
   });
});

function refreshPage() {
   if ($('#refresh').hasClass('refresh-on')) {
      location.hash = 'reload';
      window.location.reload();
   } else
     location.hash = '';
}
4

2 に答える 2

1

別のページで更新するコンテンツを保存できる場合は、単純な jquery の load() メソッドを使用できます。

更新するコンテンツを「content.php」に入れます

$("#refreshDIV").load("content.php");

このメソッドは必要に応じて呼び出すことができ、動的にロードできます。

于 2013-01-13T11:43:57.943 に答える
0

実際、jquery の load() メソッドは、分離されたコンテンツを外部スクリプトで更新するのに適した方法です...
2 つの div を含む小さな HTML ページの例を以下に示します。
1 つは 1 秒ごとに更新され、もう 1 つは 3 秒ごとに更新されます...
Div は refreshDiv 関数を使用して更新しています。
refreshDiv 関数は 3 つの引数を取ります。

  • div_id : これは、更新する div の ID です。
  • script_file : div を更新するために起動するスクリプト。(スクリプト/ディレクトリ);
  • data : GET メソッドによってスクリプト (PHP) に渡される一部のデータ。

    <html>
    <head>
       <title>Stack OverFlow - 14302842</title>
       <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
       <script type="text/javascript">
          function refreshDiv(div_id, script_file, data) {
             var today = new Date();
             $("#"+div_id).load("scripts/"+script_file+"?_"+Math.random()+"&data="+data);           
          }
    
          $(document).ready(function () {
              refreshDiv('div1','ls.php','/tmp');
              refreshDiv('div2','ls.php','/home');
    
              setInterval(function() {
                  // Do something every 3 seconds
                  refreshDiv('div1','ls.php','/tmp');
              }, 3000);
    
              setInterval(function() {
                 // Do something every 1 seconds
                 refreshDiv('div2','ls.php','/home');
              }, 1000);
    
          });
       </script>
    </head>
    <body>
        <div id="div1" style="color: #F00; border: 1px solid #F00; text-align: center;">Some Text</div>
        <div id="div2" style="color: #00F; border: 1px solid #00F; text-align: center;">Some Text</div>
    </body>
    </html>
    
于 2013-01-13T15:10:29.983 に答える