简体   繁体   English

自动刷新 PHP 和 AJAX 中的 div

[英]Auto Refresh a div in PHP and AJAX

I'm stuck with my auto refresh function in my web course assignment.在我的 web 课程作业中,我坚持使用自动刷新 function。 I always put my code like this:我总是这样写我的代码:

navigation.php:导航.php:

<html>
   <head>
     .... ALL STYLE AND JS .....
   </head>
   <body>
      <div class="menu">
          ...... ALL MY WEB MENU .......
      </div>

index.php:索引.php:

<?php
  include "navigation.php";
  function A(){
    global $variable_functionA;
    .... FUNCTION TO CALL API X BY cURL .....
  }
  function B(){
    global $variable_functionB;
    .... FUNCTION TO CALL API Y BY cURL .....
  }
?>
<div class="container">
    ...... MY WEB CONTAINER ........
    <div class="auto_refresh">
       <?php
           include "auto_refresh_data.php"; //Success when first load, failed to load style, js, etc at the second load
       ?>
    </div>
</div>
<?php
  include "footer.php";
?>

footer.php:页脚.php:

     </body>
 </html>
 <scrpt>..... ALL MY JS SCRIPT.....</script>

My ajax code:我的 ajax 代码:

<script>
setInterval(function(){
    $.ajax({
        url:'auto_refresh_data.php'
    }).done(
        function(data){
            $('.auto_refresh').html(data);
        });
},5000);
</script>

auto_refresh_data.php: auto_refresh_data.php:

<div class="style">
  <?php
   function A($variable1);
   function B($variable2);

  ... OPERATION FOR GLOBAL VARIBLE RESULT FROM function A and function B ....
  ?>
</div>

I want to make an auto refresh data in the middle of my container.我想在我的容器中间创建一个自动刷新数据。 Then I made it in ajax like this: How do i auto refresh my div class content?然后我在 ajax 中做了这样的: 如何自动刷新我的 div class 内容? . . It failed because of some php variable, style, js, function, etc placed before the auto refresh div element.它失败是因为一些 php 变量、样式、js、function 等放置在自动刷新 div 元素之前。 So the question is how to make it my data become auto refresh if my code design is like that?所以问题是,如果我的代码设计是这样的,如何让我的数据自动刷新?

Thankyou谢谢

I think there are a couple things you should be doing to fix this, but the main problem are your functions:我认为你应该做几件事来解决这个问题,但主要问题是你的功能:

1) Move your functions somewhere else, like into their own files: 1)将您的功能移到其他地方,例如放入自己的文件中:

/functions.php /functions.php

<?php
function A()
{
    global $variable_functionA;
    .... FUNCTION TO CALL API X BY cURL .....
}

function B()
{
    global $variable_functionB;
    .... FUNCTION TO CALL API Y BY cURL .....
}

2) Include the functions in the main file where it's used on load: 2)在加载时使用的主文件中包含函数:

/index.php /index.php

<?php
include("functions.php");
include("navigation.php");
?>
<div class="container">
    ...... MY WEB CONTAINER ........
    <div class="auto_refresh">
       <?php include("auto_refresh_data.php") ?>
    </div>
</div>
<?php include("footer.php") ?>

3) On the auto_refresh_data.php page, you need to include the functions again, but use include_once instead of include so you don't get a declaration error: 3) 在auto_refresh_data.php页面上,您需要再次包含函数,但使用include_once而不是include ,这样您就不会收到声明错误:

<?php include_once("functions.php") ?>

<div class="style">
  <?php
  # Presumably you want to run these functions?
  A();
  B();

  ... OPERATION FOR GLOBAL VARIBLE RESULT FROM function A and function B ....
  ?>
</div>

4) Since you aren't really doing anything special with the ajax, I would just use .load() : 4)由于您对 ajax 并没有真正做任何特别的事情,我只会使用.load()

<script>
$(function() {
    setInterval(function(){
        $('.auto_refresh').load('auto_refresh_data.php');
    },5000);
});
</script>

Further to this, I would probably look at using setTimeout() recursively vs setInterval() just because if you get a delay in response, you may get those responses out of time.除此之外,我可能会考虑递归地使用setTimeout()setInterval() ,因为如果您的响应延迟,您可能会超时获得这些响应。 Using setTimeout will fire after the response is returned as opposed to every 5 seconds whether the response has come back yet or not.使用setTimeout将在响应返回后触发,而不是每 5 秒触发一次,无论响应是否返回。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM