0

5秒ごとindex.phpに実行したいファイルがあります。getdata.php

getdata.phpのさまざまな場所に表示する必要がある複数の変数を返しますindex.php。

.load()運が悪かったので、jQuery関数を使おうとしています。
のさまざまな場所で12個の<div>要素が更新されますが、最新のデータを取得する必要がindex.phpあるファイルは再実行されません。getdata.php

しかし、ブラウザの更新ボタンを押すと、データが更新されます。

getdata.php約15個の変数を返します。

サンプルコードは次のとおりです。

<script>
    var refreshId = setInterval(function()
    {
         $('#Hidden_Data').load('GetData.php'); // Shouldn´t this return $variables
         $('#Show_Data_001').fadeOut("slow").fadeIn("slow");
         $('#Show_Data_002').fadeOut("slow").fadeIn("slow");
         $('#Show_Data_003').fadeOut("slow").fadeIn("slow");
         $('#...').fadeOut("slow").fadeIn("slow");
    }, 5000); // Data refreshed every 5 seconds
    */
</script>

次に例を示しGetData.phpます。

$query = "SELECT column1, COUNT(column2) AS variable FROM table GROUP BY column";
$result = mysql_query($query) or die(mysql_error());

while($row = mysql_fetch_array($result)){
$column1 = $row['column1 '];
$variable = $row['variable '];

if($column1 == "Text1") { $variable1 = $variable; }
    elseif($column1 == "Text2") { $variable2 = $variable; }
              ... continues to variable 15 ...
}

次に、ページのさらに下にあるHTML要素にデータが表示されます。

<div id="Hidden_Data"></div>
<div id="Show_Data_001"><?php echo $variable1; ?></div>
<div id="Show_Data_002"><?php echo $variable2; ?></div>
<div id="Show_Data_003"><?php echo $variable3; ?></div>
...

ここで提案されているようにデータパラメータを使用してみました： https ：//stackoverflow.com/a/8480059/498596

しかし、5秒ごとにすべての変数をロードして、インデックスページでそれらを呼び出す方法を完全に理解することはできませんでした。

今日はGetData.phpページが戻るだけ$variable1 = X; $variable2 = Yです。

UPDATE
何らかの理由で、jQueryがGatData.phpファイルをロードして変数を更新していません。

に「Hidden_​​Data」を追加してみたところinclude('GetData.php')、ページ上で変数が読み取れるようになりました。

この部分を削除すると、ページに「変数が設定されていません」という警告が表示され、jQueryがGetData.phpスクリプトをにロードしていないことを示しHidden_Data <div>ます。

4

3 に答える 3

2

試す 

 <script>
        var refreshId = setInterval(function()
        {
             $('#Hidden_Data').load('GetData.php', function() { // Shouldn´t this return $variables
                 $('#Show_Data_001').fadeOut("slow").fadeIn("slow");
                 $('#Show_Data_002').fadeOut("slow").fadeIn("slow");
                 $('#Show_Data_003').fadeOut("slow").fadeIn("slow");
                 $('#...').fadeOut("slow").fadeIn("slow"); });
        }, 5000); // Data refreshed every 5 seconds
        */
    </script>

上記は、コードが HTML 要素 (Show_Data_XXX) のスニペットを返すと仮定していますが、上記の質問を明確にしたので、単独では役に立ちません...

あなたがする必要があるのは、あなたのphpで新しい値要素を送り返すか、結果をデータとして送り返し、既存の要素を更新することです。

要素をphp配列に入れ、SQL呼び出し後にdata.phpを送り返します

$results = Array();
while($row = mysql_fetch_array($result)){
   $column1 = $row['column1 ']; // change Text1 in db to Show_Data_001 in html or vice versa
   $variable = $row['variable '];
   $results[$column1] = $variable;
}

echo json_encode($results);

あなたのJavaScriptでこのようなもの...

$.getJSON('GetData.php',function(data) {
$.each(data, function(key, val) {
    $('#'+key).text(val);
  });
});

少し複雑になるので、fadeOut と fadeIn は例に入れませんでした。getJSON を呼び出す前に、これらすべての要素に対して fadeOut を実行し、結果が注がれるように fadeIn を実行できます。これが役立つことを願っています。

于 2012-11-23T01:25:28.703 に答える
1

まず、次のように、サーバーからの応答が正しいことを確認します。

//We won't use load() to load content for now
window.setInterval(function(){

   $.ajax({
      url : "path_to_your_php_script.php",
      type : "GET",
      beforeSend: function(){
         //here you can display, smth like "Please wait" in some div
      },
      error : function(msg){
         //You would know if an error occurs  
         alert(msg);
      },
      success : function(respondFromPHP){
         //Are you getting distinct results every 5 sec?
         alert(respondFromPHP);
         return;
         //if respondFromPHP contains data you want
         //ONLY THEN, add some effects
      }
    });

}, 5000);

このアプローチとあなたのアプローチの唯一の違いは、エラーを処理して、必要なデータを確実に取得できることです。

于 2012-11-23T04:05:56.033 に答える
0

GetData.php のコードを見せてもらえますか?

Jquery.load を使用する代わりに、実際に $.post または $.get を使用してページを取得し、結果を GetData.php から Json または xml にフォーマットして、JavaScript に簡単にマップすることができます。

$.post を使用すると、GetData.php から値を取得した後にコールバックを行うことができ、正しく機能しているかどうかを確認できます。GetData.php からデータを取得する場合は、それを DIV 要素に入力できます。

POST および GET に関する詳細は、http: //api.jquery.com/jQuery.post/で確認できます。

于 2012-11-23T01:26:40.260 に答える