javascript - 当计时器倒计时时，我如何使它刷新/更新文本文件中的文本？

Question

在我的代码中，我的网站上有一个文本文件，我逐行读取它并将其显示在 jquery 插件 newsTicker 上。在这种情况下，我还有一个倒计时 4 分钟的计时器，我没有显示计时器，但它倒计时。

我希望当计数器/计时器到达 0 小时 0 分 0 秒时，它会以某种方式刷新我网站上的页面，或者以某种方式刷新文本文件读取部分，以便它显示文本文件的新内容。

我有一个用 C# 编写的程序，每 4 分钟更新一次文本文件内容，然后将其上传到我的网站。例如，第一次文本文件内容是:Hello World，我的网站显示 Hello World。然后 4 分钟后文本文件内容为: This is a test现在我希望它显示在 jquery 插件中:这是一个测试

然后由于某种原因计时器应该再次开始倒计时 4 分钟，现在计时器停止在 0 0 0。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://risq.github.io/jquery-advanced-news-ticker/assets/js/jquery.newsTicker.js"></script>
<style>
.newsticker {
    max-width: 620px;
    margin: auto;
}

.newsticker li {
    color: #4e4e4e;
    background: #F2F2F2;
    overflow: hidden;
    height: 28px;
    padding: 10px;
    line-height: 30px;
    list-style: none;
    font-size: 20px;
    text-align: left;
    border-bottom: 1px dotted #2c8162;
}

.newsticker li:hover {
    background: #FFF;
}
</style>
<script language='JavaScript'>
   var count = 300;
    var counter = setInterval(timer, 1000); //1000 will  run it every 1 second

    function timer() {
    count = count - 1;
    if (count == -1) {
            clearInterval(counter);
            return;
    }

    var seconds = count % 60;
    var minutes = Math.floor(count / 60);
    var hours = Math.floor(minutes / 60);
    minutes %= 60;
    hours %= 60;
    //document.getElementById("timer").innerHTML = hours + " Hours " + minutes + //" Minutes and " + seconds + " Seconds left untill the next news update."; // //watch for spelling
    }
   $('body').find('.newsticker').remove();//It will clear old data if its present 
   var file = "http://newsxpressmedia.com/files/theme/test1.txt";
    $.get(file, function (txt) {
            //var lines = txt.responseText.split("\n");
            var lines = txt.split("\n");
            $ul = $('<ul class="newsticker" />');
            for (var i = 0, len = lines.length; i < len; i+=1) {  // step: 3
                //save(lines[i]); // not sure what this does
                $ul.append('<li>' + lines[i] + '</li>'); //here 
                //$ul.append('<li>' + lines[i+1] + '</li>');
            }
            //$ul.appendTo('body').newsTicker({
            $ul.appendTo('div.wcustomhtml').newsTicker({
                row_height: 48,
                max_rows: 5,
                speed: 600,
                direction: 'up',
                duration: 1000,
                autostart: 1,
                pauseOnHover: 1
            });
    });
</script>
<br><br><span id="timer"></span><br><br>

Answer 1

无需使用定时器。查看 setTimeout 函数:http://www.w3schools.com/jsref/met_win_settimeout.asp

<script language='JavaScript'>
    function updateTicker() {
        $('body').find('.newsticker').remove();//It will clear old data if its present 
        var file = "http://newsxpressmedia.com/files/theme/test1.txt";
        $.get(file, function (txt) {
            //var lines = txt.responseText.split("\n");
            var lines = txt.split("\n");
            $ul = $('<ul class="newsticker" />');
            for (var i = 0, len = lines.length; i < len; i+=1) {  // step: 3
                //save(lines[i]); // not sure what this does
                $ul.append('<li>' + lines[i] + '</li>'); //here 
                //$ul.append('<li>' + lines[i+1] + '</li>');
            }
            //$ul.appendTo('body').newsTicker({
            $ul.appendTo('div.wcustomhtml').newsTicker({
                row_height: 48,
                max_rows: 5,
                speed: 600,
                direction: 'up',
                duration: 1000,
                autostart: 1,
                pauseOnHover: 1
            });
        });

        // 4 minutes in millisecondes
        setTimeout(updateTicker, 240000);
    }
    updateTicker();
</script>