每15秒读取一个文本文件的内容

Read the contents of a text file every 15 seconds

本文关键字：文件 文本 一个 读取 15秒      更新时间：2023-09-26

我在一个音乐网站工作:我在服务器上有一个文本文件，其中包含当前播放的歌曲的名称。我希望每隔15秒读取一次文本文件，并更改我网站上显示的文本，没有刷新。

现在，使用一点jQuery和javascript，我实际上已经到了文件被读取和第一次显示的地方，但它不会刷新。我已经尝试了各种各样的setInterval函数，但对于我的生活，我不能得到这部分的工作。任何帮助都将非常感激。

我有:

<script type="text/javascript"> 
$(document).ready(function() {
    jQuery.get('http://www.XXXXX.com/nowplaying/NowPlaying.txt', function(data) {
        var myvar = data;
        var parts = myvar.split(/'n/);
        var songtitle = parts[0];
        var songartist = parts[1];
        var songalbum = parts[2];
        var songtime = parts[3];
        $('#songtitleholder').html(songtitle);
        $('#songartistholder').html(songartist);
        $('#songalbumholder').html(songalbum);
    });
});​
</script>

您可以将想要执行repeatedly的代码放在函数中，并将该函数传递给setTimeout。setTimeout的第二个参数将在millisecond中取interval。

在这里使用setTimeout在这里IMO更appropriate，因为它将排除发送请求和接收响应所花费的时间。它将send request every 5 second after receiving response. 

<script type="text/javascript"> 
 $(document).ready(function() {
    function functionToLoadFile(){
      jQuery.get('http://www.XXXXX.com/nowplaying/NowPlaying.txt', function(data) {
       var myvar = data;
       var parts = myvar.split(/'n/);
       var songtitle = parts[0];
       var songartist = parts[1];
       var songalbum = parts[2];
       var songtime = parts[3];
       $('#songtitleholder').html(songtitle);
       $('#songartistholder').html(songartist);
       $('#songalbumholder').html(songalbum);
       setTimeout(functionToLoadFile, 5000);
    });
    }
    setTimeout(functionToLoadFile, 10);
});
</script>

您应该能够像这样将示例封装在setInterval调用中:

$(document).ready(function() {
    setInterval( function(){
    jQuery.get('http://www.XXXXX.com/nowplaying/NowPlaying.txt', function(data) {
        var myvar = data;
        var parts = myvar.split(/'n/);
        var songtitle = parts[0];
        var songartist = parts[1];
        var songalbum = parts[2];
        var songtime = parts[3];
        $('#songtitleholder').html(songtitle);
        $('#songartistholder').html(songartist);
        $('#songalbumholder').html(songalbum);
    });
    }, 15000);
});​

创建一个函数并使用setInterval调用它(您可能希望在URL中添加时间戳，以便结果不缓存)

$(document).ready(function() {
    function refresh(){
        jQuery.get('http://www.XXXXX.com/nowplaying/NowPlaying.txt', { "t": $.now() }, function(data) {
            var myvar = data,
                parts = myvar.split(/'n/),
                songtitle = parts[0],
                songartist = parts[1],
                songalbum = parts[2],
                songtime = parts[3];
            $('#songtitleholder').html(songtitle);
            $('#songartistholder').html(songartist);
            $('#songalbumholder').html(songalbum);
        });
    }
    setInterval(refresh, 15000);
});​

为什么不试试呢?

    window.setInterval(function(){
    /// call your function here
    }, 15000);

使用setTimeout解决方案。当窗口在切换浏览器选项卡时失去焦点时，setInterval往往会排队。

$(document).ready(function() {
    getData();
});​
function getData() {
    setTimeout(function() {
        jQuery.get('http://www.XXXXX.com/nowplaying/NowPlaying.txt', function(data) {
            var myvar = data;
            var parts = myvar.split(/'n/);
            var songtitle = parts[0];
            var songartist = parts[1];
            var songalbum = parts[2];
            var songtime = parts[3];
            $('#songtitleholder').html(songtitle);
            $('#songartistholder').html(songartist);
            $('#songalbumholder').html(songalbum);
            /* repeat getData*/
            getData();
        });
    }, 15000)
}

除了根据每个人的答案使用setInterval之外，还可以通过请求确保文件没有被缓存:

jQuery.get("http://......./NowPlaying.txt?t="+new Date().getTime(), function....);
相关文章：