不断刷新/接收输出<div>问题

时间:2016-10-21 23:30:50

标签: jquery css

所以我有这个JavaScript代码,旨在不断收到我网站上文件的输出

$(function() {
    function reloadTable() {
        $.get("pot1.php", function(data) {
            $("#pot").html(data);
        });
    }
    reload = setInterval(reloadTable, 1000);
});

这是使用id“pot”的div

<div id="pot">
    <div id="timeleft">
        <h2 class="text-primary text-center"><span class="tl1" id="tl1"><?php include('tl1.php');?></span></h2>
    </div>
    <div>
        <h1>Jackpot:
            <font color="#598749"><span class="pot1"><?php include('pot1.php');?></span></font>
        </h1>
    </div>
    <?php include('/spinfunction/raffleanim.php'); ?>
</div>

但它似乎没有任何帮助吗?

1 个答案:

答案 0 :(得分:0)

您是否检查过浏览器没有缓存它?

您是否还确保AJAX请求不是404ing并且实际上是在接收有效数据?

看起来它非常“可缓存”,因为它是一个GET请求,并且没有查询字符串。

可能阻止缓存的一些事情:

  • 从服务器返回标头以防止缓存
  • 将其更改为POST请求
  • 为每个请求附加不同的查询字符串

有关这些

的更多信息

标题:

https://stackoverflow.com/a/21609642/5302749

在回复之前添加以下内容:

cache: false

POST请求 https://api.jquery.com/jquery.post/ -

  

使用POST获取的页面永远不会被缓存,因此jQuery.ajaxSetup()中的cache和ifModified选项对这些请求没有影响。

每次附加不同的查询字符串 正如@Barmar所提到的,您也可以提供.fail作为选项我相信某些版本的jQuery不允许您将选项直接传递给$ .get所以我已将其更改为$ .ajax,也是错误处理总是一个好主意,所以我添加了 $(function() { function reloadTable(){ $.ajax({ url: "pot1.php", cache: false, }) .done(function( data ) { $( "#pot" ).html( data ); }) .fail(function(jqXHR, textStatus, errorThrown){ console.log('Error: ' + textStatus ); // error handling here }); } reload = setInterval(reloadTable, 1000); }); 回调。

   $(function() {
       var reloadCount = 0;
       function reloadTable(){
            reloadCount++;
            $.get("pot1.php?reloadCount=" + reloadCount, function(data) {
                $("#pot ).html(data);
            });
       }
       reload = setInterval(reloadTable, 1000);
   });

或者手动添加参数(这只是因为没有包含错误处理而看起来更小) - 我认为最好不要重新发明轮子并尽可能使用jQuery的内置函数。

import { Injectable } from '@angular/core';
import { Headers, Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/Rx';
import 'rxjs/add/observable/throw';
import { AppState } from './state.service';

@Injectable()
export class ApiService {
  token: string = this._appState.get('_token');

  headers: Headers = new Headers({
    'Content-Type': 'application/json',
    Accept: 'application/json',
    'Authorization': this.token ? this.token : null
  });

  api_url: string = '/';

  constructor(private http: Http, public _appState: AppState) {}

  private getJson(response: Response) {
    return response.json();
  }

  private checkForError(response: Response): Response {
    if (response.status >= 200 && response.status < 300) {
      return response;
    } else {
      let error = new Error(response.statusText);
      error['response'] = response;
      console.error(error);
      throw error;
    }
  }

  getall(path: string): Observable<any> {
    console.log('from api', this.token);
    return this.http.get(`${this.api_url}${path}`, { headers: this.headers })
    .map(this.checkForError)
    .catch(err => Observable.throw(err))
    .map(this.getJson);
  }

  get(path: string, query: string): Observable<any> {
    return this.http.get(`${this.api_url}${path}/${query}`, { headers: this.headers })
    .map(this.checkForError)
    .catch(err => Observable.throw(err))
    .map(this.getJson);
  }

  post(path: string, body): Observable<any> {
    return this.http.post(
      `${this.api_url}${path}`,
      JSON.stringify(body),
      { headers: this.headers }
    )
    .map(this.checkForError)
    .catch(err => Observable.throw(err))
    .map(this.getJson);
  }

  put(path: string, query: string, body): Observable<any> {
    return this.http.put(
        `${this.api_url}${path}/${query}`,
        JSON.stringify(body),
        { headers: this.headers }
      )
      .map(this.checkForError)
      .catch(err => Observable.throw(err))
      .map(this.getJson);
  }

  delete(path: string): Observable<any> {
    return this.http.delete(
      `${this.api_url}${path}`,
      { headers: this.headers }
    )
    .map(this.checkForError)
    .catch(err => Observable.throw(err))
    .map(this.getJson);
  }
}