0

На сайте есть блок с контентом который приходит средствам API с другого сервера. И чтобы увидеть изминение этого контента постоянно нужно обновлять страницу. как сделать так чтобы этот контент обновлялся сам без перезагрузки самой страницы. Вот для того чтобы увидеть изменение значения в div нужно каждый раз обновлять страницу. Ка же сделать чтобы эти значения обновлялись без перезагрузки страницы?

<?php
    $url = file_get_contents('https://api.cryptonator.com/api/ticker/ltc-usd');
    $content = json_decode($url, true);
    $result =  $content['ticker']['price'];
    ?>
<div class="result" id="result"> <? echo $result; ?> </div>
1
  • Теоретически: Создать отдельную страницу которая будет отдавать только ответ. Посредством js, за определенный срок, скажем 5-10 сек, отправлять запрос и выводит его в этот блок 23 сен 2017 в 13:50

1 ответ 1

1

Скрипт будет каждые 5000 милисекунд(5 секунд) обновлять информацию в div#result.

Чтобы менять цвета, когда новый прайс больше старого и меньше старого на красный и зеленый соответственно, нужно будет сохранять каждый раз предыдущий результат. Создадим глобальную переменную price и запишем в него текущий результат и при получении нового результата сверим с price и выведем соответствующий цвет.

P.S. При первом запросе и в случае совпадении значений старого результата и нового, div#result будет бесцветным.

var price;
var reloadData = function() {
  $.getJSON('https://api.cryptonator.com/api/ticker/ltc-usd', function(data){
    var float = parseFloat(data.ticker.price).toFixed(2)
    if(price && price > float) {
        $('#result').html('<font color="red">' + float + '</font>')
    }
    else if(price && price < float) {
        $('#result').html('<font color="green">' + float + '</font>')
    }
    else {
        $('#result').text(float)
    }
    price = float
  })
}

setInterval('reloadData()', 5000)
$(document).ready(reloadData)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="result">Loading...</div>

7
  • А как после запятой отображать только 2 символа ? Знаю что через .toFixed(2) можно , но куда его тут поставить , без понятия
    – Encode_VI
    23 сен 2017 в 14:29
  • @Encode_VI обновил ответ
    – mix
    23 сен 2017 в 14:34
  • Спасибо большое )) Заработало)))
    – Encode_VI
    23 сен 2017 в 14:38
  • Ребятки, не судите строго, учусь пока. А как сделать так чтобы если значение растёт , текст становиться зелёным, а если значение падает то текст становиться красным
    – Encode_VI
    23 сен 2017 в 14:53
  • @Encode_VI еще раз обновил ответ
    – mix
    23 сен 2017 в 15:24

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.