0

我想做的是每次值增加或减少时播放一个小动画。使用此代码，我每秒都会从 XML 源更新我的值。动画只应在值增加时执行。所以如果我的值为 62 并更新为 62，则不应执行任何动画。当我的值为 62 并更新为 63 时，我希望这个动画发生。有谁知道如何修改此代码以实现这一目标？

function updateAll()
{
$.ajax({
    type: "GET",
    url: "/ajax/ajax.updatedata.php",
    data: "",
    success: function(html){
        html = JSON.parse(html);

        if(html instanceof Object)                                 
        {
            // projecten
            $('#projecten-aantal').html(html['projecten'][0]['waarde']);
            $('#projecten-afgerond').html(html['projecten'][1]['waarde']);



            var projecten_aantal = parseInt(html['projecten'][0]['waarde']);
            var projecten_afgerond = parseInt(html['projecten'][1]['waarde']);

            var  sampleDataProjecten = [
                { naam: html['projecten'][0]['naam'], waarde: parseInt(html['projecten'][0]['waarde']), percent: parseFloat(html['projecten'][0]['percent'])},
                { naam: html['projecten'][1]['naam'], waarde: parseInt(html['projecten'][1]['waarde']), percent: parseFloat(html['projecten'][1]['percent'])}
            ];

            var settingsProjecten = {
                enableAnimations: false,
                source: sampleDataProjecten
            };
            $('#pie-chart-projecten').jqxChart(settingsProjecten);
            $('#pie-chart-projecten').jqxChart('refresh');

            // domeinwinkel
            var aantalRegistraties = 0;

            for(var i=0;i<=6;i++)
            {
                aantalRegistraties += parseInt(html['domeinwinkel'][i]['waarde']);
            }

            $('#domeinwinkel-registraties').html(aantalRegistraties);

            var  sampleDataDomeinwinkel = [
                { naam: html['domeinwinkel'][5]['naam'], waarde: parseInt(html['domeinwinkel'][5]['waarde']) },
                { naam: html['domeinwinkel'][4]['naam'], waarde: parseInt(html['domeinwinkel'][4]['waarde']) },
                { naam: html['domeinwinkel'][3]['naam'], waarde: parseInt(html['domeinwinkel'][3]['waarde']) },
                { naam: html['domeinwinkel'][2]['naam'], waarde: parseInt(html['domeinwinkel'][2]['waarde']) },
                { naam: html['domeinwinkel'][1]['naam'], waarde: parseInt(html['domeinwinkel'][1]['waarde']) },
                { naam: html['domeinwinkel'][0]['naam'], waarde: parseInt(html['domeinwinkel'][0]['waarde']) },
                { naam: html['domeinwinkel'][6]['naam'], waarde: parseInt(html['domeinwinkel'][6]['waarde']) }
            ];

            var settingsDomeinwinkel = {
                enableAnimations: false,
                source: sampleDataDomeinwinkel
            };

            $('#line-chart-domeinwinkel').jqxChart(settingsDomeinwinkel);
            $('#line-chart-domeinwinkel').jqxChart('refresh');

            // serverload
            var barcolors = new Array();

            //Serverload bars
            for(var i=0;i<=6;i++)
            {
                var setBarWidth = (parseFloat(html['servers'][i]['waarde'])/2)*100;
                if(setBarWidth > 100)
                {
                    barcolors[i] = 100;
                }
                else
                {
                    barcolors[i] = setBarWidth;
                }
            }

            $("[id^=serverload]").filter(function() {
                var i = this.id.substring(10),
                    width = barcolors[i-1];

                if (width !== undefined)
                    this.style.width = width + "%";

                return width > 50;
            }).addClass("redbar");

            $("[id^=serverload]").filter(function() {
                var i = this.id.substring(10),
                    width = barcolors[i-1];

                if (width !== undefined)
                    this.style.width = width + "%";

                return width <= 50;
            }).removeClass("redbar");
        }
        else
        {
            console.log('Fout bij het updaten van de data: html is geen array');
            console.log(html);
        }
    }
});

}

有关上述代码的更多信息：

上面的代码是更新值（span 元素，其中包含文本和 JQuery 折线图和饼图），这些值将从 XML 文件中检索，该 XML 文件包含以下序列中的数据（已翻译）：

<root>
  <projects>
   <entry>
    <name>Total</name>
    <value>10</value>
    <percent>100</percent>
   </entry>
   <entry>
    <name>Finished</name>
    <value>5</value>
    <percent>50</percent>
   </entry>
  </projects>
  <tasks>
   <entry>
    <name>Total</name>
    <value>20</value>
   </entry>
  </tasks>
  etc.
</root>

XML 文件将由 cron 作业更新，因此没有直接使用数据库或隐藏字段来保存值。

4

2 回答 2

0

将当前值保留在隐藏字段中，当您收到响应时，检查隐藏值，完成逻辑后，使用更新后的值更新隐藏值。

于 2013-03-25T13:04:26.790 回答
0

是的 - 保留一个公共变量，它将代表您的currentScore. 每次收到AJAX回复时，请检查找到的值并将其与您的 public 进行比较currentScore。从那里，您可以使用一个简单的if条件来确定是否currentScore大于或小于返回值。

于 2013-03-25T13:01:24.637 回答