Как обновить div через AJAX

242

25 сентября 2017, 01:04

На сайте есть блок с контентом который приходит средствам 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>

Answer 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>

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Как выбрать атрибут selected с помощью функции str_replace на PHP

Есть такой код:

291

HTML

SVG ссылка как object не через JS

Здравствуйте! Вопрос такой: У меня есть svg файл, там логотип компанииОн имеет пару стилей

312

HTML

Не могу клонировать код JS

Есть код только для одного divМне нужно эту функцию применить к другим дивам с разными id

194

HTML

Iframe. Изменить размер содержимого

Есть iframeОн хватает сайт с онлайн игрой

357