2

以前にstackoverflowで問題を解決しましたが、プロジェクトの要件が変更されたため、新しい解決策が必要です。要約すると、5秒ごとに実行されてJSONファイルの変更を読み取るgetJSON関数があります。私が抱えている問題は、データを正しく出力することです。データを1回出力したいのですが、ユーザーが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"
}

うまくいけば、私はこれをできるだけ明確にしました

4

3 に答える 3

6

2つの異なる結果があり、そのうちの1つを実際に達成しようとしている可能性があるため、質問を解読するのは困難です。

  • 最新のJSON結果のみが表示されます(変更履歴はありません)
  • 変更ごとに1つの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. より動的なソリューションは、JSONオブジェクトのプロパティで機能するTrinhHoangNhuによって提供されます。

  3. 3番目に考えられる解決策は、最後の変更のタイムスタンプ(names.json/timestamp)を追加してAjax URLを呼び出すことです。サーバーは、JSONが後で変更されたことを確認すると、オブジェクトを送信します。それ以外の場合は、デフォルトのオブジェクト(falseまたはnull)が送信されます。変更が加えられていないこと...

于 2012-07-19T09:50:10.297 に答える
0

oldJsonを追加して、新しいJsonと比較します。彼らが違うときだけあなたは出て行くでしょう。元

var oldJSON = null;

function compareObject(a,b){//Simple comparision
   for (i in a){
       if (!(i in b) || a[i] != b[i]){
          return false;
       }
   }
   return true;
}

setInterval(function() {
    $.getJSON('names.json', function(data) {
        //do the comparision
        if (!compareObject(oldJSON, data)){
            for (var i in data) {
                $('#one').append(data[i]);
            }
        }
        oldJSON = data;; //Important
    });
}, 5000);
于 2012-07-19T09:57:26.933 に答える
0

JSONタグに追加し、JSONversionを変更するたびにインクリメントするだけです。

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

次に、追加する前にjavascriptチェックversionタグで:

<script type="text/javascript">
    var currentVersion=-1;
     $.ajaxSetup ({  

       cache: false  
    });  

   setInterval(function(){ $.getJSON('names.json', function(data) {

    if(data.version>currentVersion)
    {
      currentVersion=data.version;
      $('#one').append(data.one);
      $('#one').append(data.two);
      $('#one').append(data.three);
    }

   });

},5000);

</script>
于 2012-07-19T09:49:49.597 に答える