0

我使用 $.getJSON 从 PHP 脚本接收一些数据(JSON 编码)。它由 10 个数据集({"key":"data",...})组成。我想打印所有数据,首先淡出旧的刺,然后用新的刺替换它,最后淡入。这将在一个循环中发生。

处理数据集时,该函数会调用自身并获取接下来的 10 个数据集以打印它们。等等。

function getText(){

    $.getJSON("getText.php",
        function(data){
            for(key in data){
                //alert(key);
                if($("#wrapper").css("display") == "block")
                    $("#wrapper").fadeOut(500);

                $("#wrapper").html(data[key]).fadeIn(500); 
            }
    });
    //alert("end");

    setTimeout(function(){
        getText();
    },20000);
}

有一些警报会显示正确的数据集,但没有它们只会显示数据集中的最后一个或第一个数据。有人可以帮我吗?!

简化后只有一个 div (#wrapper)。在页面加载并显示一些信息后,第一次调用函数 getText。现在调用 PHP 脚本,我们收到十个数据集。这些中的每一个都应在函数再次调用自身之前显示。例如:淡入包装,显示数据#1,淡出包装;淡入包装,显示数据#2,淡出包装,依此类推,直到显示所有数据(共十个)。循环应该以某种方式等待动画。并且包装中的文本应被替换。

4

2 回答 2

1

鉴于你的更新试试这个:

function getText(){
var storage = {};
$("#wrapper").html('').fadeOut(500);
    $.getJSON("getText.php",
        function(data){
        storage.data = data;
                    });
     for (var i in storage.data)
      {
          $("#wrapper").html(storage.data[i]).fadeIn(500).delay(5000).fadeOut(500);
          if (i == storage.data.length-1)
          {
              setTimeout(function(){
                 getText();
              },50000);
          }
      }
}

或者

setInterval('getText',20000);
function getText(){
    var storage = {};
       $.getJSON("getText.php",
            function(data){
            i = (typeof(storage.i) != "undefined") ? storage.i : 0;
         setInterval(function() {
              $("#wrapper").fadeOut(500).html(storage.data[i]).fadeIn(500);
storage.i = i+1;
},2000);

          });
    }
于 2012-05-13T10:42:34.460 回答
0

那么,我认为,这就是您要寻找的 +/- ..

function getText(){
    $.getJSON("getText.php", function(data) {
       var keys = [];
       for(var key in data){
          keys.push(key);
       }

       function displayData() {
          var key = keys.pop();
          $("#wrapper").html(data[key]).fadeIn(500, function(){
             if(keys.length>0) {
                // Still some data available ..
                displayData();
             } else {
                // All data has been displayed .. get some new from server ..
                getText();
             }
          });
       }

       // If some data is available, show first ..
       if(keys.length>0) {
          displayData();
       }
   }); 
}
于 2012-05-13T10:34:31.667 回答