简体   繁体   中英

Automatically Refreshing <div>

I am trying to create a piece of code that automatically refreshes every 5 seconds. It is not working, I have no clue why. I have been looking for a few hours now.

JavaScript:

$(document).ready(function(){
    refreshTable();
});

function refreshTable(){
    $('#songname').load('<?php include_once 'http://api.flare-radio.com/php/song/' ;?>', function(){
        setInterval(function(){

        }, 5000);

    });
}

HTML Code:

<div class="container1">
    <div class="song container">
        <div id="songname"></div>
        <br/>
        <h2 class="song">Presenter: <?php include_once 'http://api.flare-radio.com/php/presenter/' ;?></h2>
        <br/>
        <br/>
        <audio id="radioplayer" src="http://srv.flare-radio.com:8000/stream" autoplay></audio><input id="volume" name="volume" min="0" max="1" step="0.01" type="range" onchange="setVolume()"/>
    </div>
</div>

The part you want to do every 5 seconds needs to be inside the function you deliver as an argument to setInterval.

Javascript:

$(document).ready(function(){
    refreshTable();
});

function refreshTable(){
    setInterval(function() {
        $.get('stream_path.php', function(data)  { //maybe adjust path to php file
            $("#songname").html(data);
        }, 'text');
    }, 5000);
 }

Edit: above and below

Check code snippet above for adjustment. I would recommend to use the get function of jQuery and return the data from additional php file (doesn't work directly from js because js is on clients side. php runs on server)

So my final solution (checked it and worked for me)

Javascript:

-see above

stream_path.php:

$url = 'http://api.flare-radio.com/php/song/';
echo file_get_contents($url);

html content:

<div class="container1">
    <div class="song container">
        <div id="songname"><?php echo file_get_contents('http://api.flare-radio.com/php/song/'); ?></div>
        <br>
        <h2 class="song">Presenter: <?php echo file_get_contents('http://api.flare-radio.com/php/presenter/') ;?></h2>
        <br>
        <br>
        <audio id="radioplayer" src="http://srv.flare-radio.com:8000/stream" autoplay></audio><input id="volume" name="volume" min="0" max="1" step="0.01" type="range" onchange="setVolume()"/>
    </div>
</div>
    setInterval(function(){
   $('#songname').load('<?php include_once 'http://api.flare-radio.com/php/song/' ;?>' 
 }, 5000);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM