Question

我有一个index.php文件，我希望每5秒运行一次getdata.php。

getdata.php返回需要在index.php的不同位置显示的多个变量。

我一直在尝试使用jQuery .load()函数而没有运气它会刷新<div>上不同位置的12个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，依此类推。

更新
出于某种原因，jQuery没有加载GatData.php文件并刷新变量。

我尝试将“Hidden_Data”添加到include('GetData.php')，然后变量在页面上可读。

如果我删除此部分，页面会显示“未设置变量”警告，表明jQuery未将GetData.php脚本加载到Hidden_Data <div>。

Answer 1

尝试

 <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和fadeIn之前对所有这些元素执行fadeOut，因为结果正在涌入。希望这有帮助

Answer 2

首先，请确保您从服务器获得正确的响应，如下所示：

//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);

这种方法与您的方法的唯一区别在于，您可以处理错误并确保获得所需的数据。

Answer 3

你能告诉我GetData.php的代码吗？

您可以实际获取带有$ .post或$ .get的页面，并将结果从GetData.php格式化为Json或xml，而不是使用Jquery.load，您可以轻松地将其映射到您的javascript。

使用$ .post它将允许您在从GetData.php获取值后进行回调，并且您可以检查它是否正常工作。如果它从GetData.php获取数据，那么您可以将其填充到DIV元素中。

您可以在此处查看有关POST和GET的更多信息： http://api.jquery.com/jQuery.post/

每隔x秒刷新多个PHP值的最佳方法是什么？

3 个答案: