Question

我想刷新<?php print "R";print_r($convert->toCurrency('ZAR', 1));print " / $";print_r($convert->toCurrency('USD', 1)); ?>

输出的块内的内容

＆＃13;

<div class="col-md-3 col-sm-6 col-xs-12">
          <div class="info-box bg-red">
            <span class="info-box-icon"><i class="fa fa-info-circle"></i></span>

            <div class="info-box-content">
              <span class="info-box-text">1 BTC = ZAR/USD</span>
              <span class="info-box-number"><?php print "R";print_r($convert->toCurrency('ZAR', 1));print " / $";print_r($convert->toCurrency('USD', 1)); ?></span>

              <div class="progress">
                <div class="progress-bar" style="width: 70%"></div>
              </div>
                  <span class="progress-description">
                    
                  </span>
            </div>
            <!-- /.info-box-content -->
          </div>
          <!-- /.info-box -->
        </div>
        <!-- /.col -->

＆＃13;

到目前为止我尝试了什么：补充道：

＆＃13;

     
<script type="text/javascript">
    function loadlink(){
        $('#in-content').load('main_con.php',function () {
        $(this).unwrap();
        });
    }
    loadlink(); 
        setInterval(function(){
        loadlink()
    }, 5000);
</script>

＆＃13;

我已将内容放入一个div中，并将其ID设为in-content。它工作，虽然它刷新时不是一个平滑的刷新，以及CSS开始改变和移动内容不合适。这很奇怪，因为它没有刷新css，只是刷新php标签内的内容。

关于如何保持连接打开并实时显示内容以及不对输出显示进行任何更改的任何想法。

任何帮助将不胜感激：）

Answer 1

你当然可以使用Taplar建议的websockets，但它带来了令人头疼的问题（服务器支持，连接等），但是对于少数元素的简单更新你并不需要它。

我过去使用过高fps的Ajax请求没有问题，这是你可以做的：

用span或div包裹你的陈述：

＆＃13;

<span class="info-box-number"><span id='conversions'></span></span>

＆＃13;

调用服务器以获取json

＆＃13;

<script type="text/javascript">
    function loadlink(){
       $.get( "data.php", function( data ) {
       $( "#conversions" ).text(data.conversions)}, "json" );
    }
    loadlink(); 
    setInterval(function(){
        loadlink();
    }, 5000);
</script>

＆＃13;

在服务器data.php上写一个端点，返回带有转换的json作为包含数据的属性。
我不会在服务器上呈现任何html，如果你有多个数据元素将它们作为json对象的不同属性返回并在loadlink中替换它们

如果你的所有html格式都很好，就不应该有刷新问题或css问题

Answer 2

将内容包装到div

中

<span class="info-box-number"><div id='btc-to-fiat'></span></span>

JavaScript在刷新内容时不会在显示时篡改css

＆＃13;

<script type="text/javascript">
  var refresh = setInterval(
  (function () {
      $("#btc-to-fiat").load("main_con.php"); 
  }), 1000);
</script>

＆＃13;

如何使用jquery和ajax

2 个答案: