Question

这里我能够在一段时间后加载div值

但我也需要默认加载div值。（当我加载页面时）

如何？

<script type="text/javascript">

$(document).ready(function() {                               
 setInterval(function(){
     $("#Temperature").html('');
     $("#Humidity").html('');
     $("#Weather").html('');
     $("#Pressure").html('');
     $("#Wind").html('');
     $("#Sunrise").html('');

  $.ajax({
       url: 'api.php',
       dataType: "json",
       type: 'GET',
       success: function(data) {
          if (data) {
            alert('Hi');
            document.getElementById("Temperature").innerHTML = data['temperature'];
            document.getElementById("Humidity").innerHTML = data['humidity'];
            document.getElementById("Weather").innerHTML = data['condition'];
            document.getElementById("Pressure").innerHTML = data['pressure'];
            document.getElementById("Wind").innerHTML = data['wind'];
            document.getElementById("Sunrise").innerHTML = data['sunrise'];
          }

       }
    });
  }, 600000);
 });

</script>


<div id="Temperature"></div>
<div id="Humidity"></div>
<div id="Weather"></div>
<div id="Pressure"></div>
<div id="Wind"></div>
<div id="Sunrise"></div>

api.php

这是我试图加载数据的api.php

<?php
  include('yahoo_weather_codes.php');
  //error_reporting(0);
    $BASE_URL = "http://query.yahooapis.com/v1/public/yql";
    $yql_query = 'select * from weather.forecast where woeid in (select woeid from geo.placefinder where state="Andhra Pradesh" and city="Amaravathi")'; 
    $yql_query_url = $BASE_URL . "?q=" . urlencode($yql_query) . "&format=json";
    // Make call with cURL
    $session = curl_init($yql_query_url);
    curl_setopt($session, CURLOPT_RETURNTRANSFER,true);
    $json = curl_exec($session);
    // Convert JSON to PHP object
    $phpObj =  json_decode($json);
    //echo '<pre>';print_r($phpObj).'<pre>';
    $fahrenheit = $phpObj->query->results->channel->item->condition->temp;
    $celsius = round(5/9*($fahrenheit-32));


   $yahoo_data = array();
   $yahoo_data['temperature'] = $celsius;
   $yahoo_data['code'] = $phpObj->query->results->channel->item->condition->code;
   $yahoo_data['humidity'] =$phpObj->query->results->channel->atmosphere->humidity;
   $yahoo_data['condition'] =$phpObj->query->results->channel->item->condition->text;
   $yahoo_data['pressure'] =$phpObj->query->results->channel->atmosphere->pressure;
   $yahoo_data['wind'] =$phpObj->query->results->channel->wind->speed;
   $yahoo_data['sunrise'] =$phpObj->query->results->channel->astronomy->sunrise; 
   $yahoo_data['sunset'] =$phpObj->query->results->channel->astronomy->sunset;
   $yahoo_data['date'] =$phpObj->query->results->channel->item->forecast['0']->date;
   $yahoo_data['city'] =$phpObj->query->results->channel->location->city;
   $yahoo_data['country'] =$phpObj->query->results->channel->location->country;
   $yahoo_data['region'] =$phpObj->query->results->channel->location->region; 
   $yahoo_data['key'] = $phpObj->query->results->channel->item->condition->code;

   echo json_encode($yahoo_data);

?>

Answer 1

试试这样：

将更新的内容保存在Recent_updates.php文件中，并在特定时间隐藏您当前的内容并显示更新的内容。

// Delay is the time in milliseconds
var delay = 60000;

var refreshId = setInterval(function () {
    $('#YourDivID').fadeOut("slow").load('Recent_updates.php').fadeIn("slow");
}, delay);

Answer 2

只需将您的AJAX加载移动到一个单独的函数，您可以在文档加载和我们的间隔中使用它。既然你已经使用了jQuery，你也可以用等效的jQuery选择器替换繁琐的getElementById：

<script type="text/javascript">
$(document).ready(function() {
  function updateData(){
    $("#Temperature").html('');
    $("#Humidity").html('');
    $("#Weather").html('');
    $("#Pressure").html('');
    $("#Wind").html('');
    $("#Sunrise").html('');

    $.ajax({
      url: 'api.php',
      dataType: "json",
      type: 'GET',
      success: function(data) {
        if (data) {
          alert('Hi');
          $("#Temperature").html(data['temperature']);
          $("#Humidity").html(data['humidity']);
          $("#Weather").html(data['condition']);
          $("#Pressure").html(data['pressure']);
          $("#Wind").html(data['wind']);
          $("#Sunrise").html(data['sunrise']);
        }
      }
    });
  }

  updateData();

  setInterval(updateData, 600000);
});
</script>

特定时间后，Php ajax刷新div

2 个答案: