输出一次getJSON结果,每隔x秒更新一次,结果不会重复

Question

我有一个先前的问题在stackoverflow上解决但我的项目的要求已经改变,所以我需要一个新的解决方案.为了夏天,我有一个getJSON函数,每5秒执行一次,以读取JSON文件中的更改.我遇到的问题是正确输出数据.我希望数据输出一次,但如果用户对JSON文件进行更改,则每5秒更新一次

这是我的代码

 <script type="text/javascript">
$.ajaxSetup({
    cache: false
});
setInterval(function() {
    $.getJSON('names.json', function(data) {
        for (var i in data) {
            $('#one').append(data[i]);
        }
    });
}, 5000);

</script>

这个getJSON函数允许我抓取JSON数据并将其附加到div的开头.然后我重新发布该函数,以便如果JSON数据发生更改,则数据会在div中发生变化.问题是数据每5秒重复一次.

15秒后意外结果

453545Beady little eyesLittle birds pitch by my doorstep
453545Beady little eyesLittle birds pitch by my doorstep
453545Beady little eyesLittle birds pitch by my doorstep

15秒后我想要的结果

453545Beady little eyesLittle birds pitch by my doorstep

如果我在脚本运行时更改了JSON 11秒

"two": "Eyes"

结果我想在15秒后得到

453545 Eyes Little birds pitch by my doorstep

而不是15秒后我得到的实际结果

453545Beady little eyesLittle birds pitch by my doorstep
453545Beady little eyesLittle birds pitch by my doorstep
453545 Eyes Little birds pitch by my doorstep

这是我正在使用的JSON文件

{
  "one": "453545",
  "two": "Beady little eyes",
  "three": "Little birds pitch by my doorstep"
}

希望我尽可能清楚地说明这一点

Answer 1

很难解读你的问题,因为可能有两个不同的结果,其中一个你实际上想要实现的:

• 仅显示最新的JSON结果(无更改历史记录)
• 每次更改只显示一个JSON结果(更改历史记录)

第一个很简单,如下:

没有历史:在显示之前清除结果

在附加新收到的结果之前,您必须清除以前的结果.

<script type="text/javascript">

    $.ajaxSetup ({  
        cache: false  
    });  

    setInterval(function(){
        $.getJSON('names.json', function(data) {
            $('#one').empty();
            for(var i in data) {
                $('#one').append(data[i]);
            }
        });
    }, 5000);

</script>

更改历史记录:检测更改

保持变革历史有几种不同的方法:

1. 第一个是由rogal111以某种方式总结的.虽然他的解决方案可能不是最好的,特别是当您生成的JSON的格式发生更改时,因为他的代码仅在JSON结果至少定义了4个字段时才起作用.如果其中任何一个缺失undefined将显示,如果添加任何其他的将被省略.

2. Trinh Hoang Nhu提供了一个更加动态的解决方案,可以处理任何JSON对象的属性.

3. 第三种可能的解决方案是通过附加最后一次更改(names.json/timestamp)的时间戳来调用您的Ajax URL ,如果服务器看到JSON之后发生了更改,它将发送该对象,否则将发送一些默认对象(即false或null),这将指示没有改变......