使用刷新更新表

时间:2014-03-19 14:07:26

标签: javascript jquery html datatables

我有一个由表组成的jquery应用程序。该表有一个时间字段和一些数字字段。我想基本每3秒增加一次值。所以我想创建一个函数,我增加数值并通过刷新函数调用它,每3秒自动刷新一次。

所以基本上最初的信息如下

  

科比·布莱恩特10:00 30 4 2

     

3秒后它应该是

     

科比·布莱恩特10:03 31 5 4

这是我所做的Fiddle

我无法做到这一点。我尝试创建一个函数,我增加表值并调用该函数

  

setInterval(updateFunction,3000);

但没有运气。这就是我想要创建一个函数的方法。

var cell = $("#example");
var currentVal = parseInt(cell.text(), 10);
cell.text( currentVal + 1 );

任何人都可以提供一些建议。我是js和jquery的新手,如果很难理解,我也很难理解,我可以澄清我的意思。

2 个答案:

答案 0 :(得分:2)

这是一种方式。将类添加到需要更新的单元格中:

<td>Lebron James</td>
<td class="updateMeTime">08:00</td>
<td class="updateMeInt">27</td>
<td class="updateMeInt">11</td>
<td class="updateMeInt">10</td>

在此示例中,类updateMeInt表示它是一个简单的整数,updateMeTime表示它是一个时间值。

然后你的更新函数将使用这些类迭代遍历每个单元格并递增:

function UpdateFunction(){
    $(".updateMeInt").each(function(index){
       var cur = parseInt($(this).text(), 10);
       $(this).text(cur + 1);    
    });

    $(".updateMeTime").each(function(index){
        var cur = $(this).text().split(":");    
        var sec = parseInt(cur[1], 10);        
        var min = parseInt(cur[0], 10);

        sec = sec + 3;
        if (sec >= 60){
             sec = 0
             min = min + 1;
        }
        $(this).text(pad(min) + ":" + pad(sec)); 

    });
} 
  

更新了 FIDDLE

答案 1 :(得分:1)

在间隔函数上尝试此代码:

$("#example > tbody tr").each(function(){
    var s = 0; //--- var for not increase 1st td ---
    $("td",this).each(function(){
        var data = $(this).html();
        if(/^[0-9]+\.?[0-9]*$/.test(data)){
          $(this).html(++data);   
        } else {
            if(s == 1) {
              date = new Date();
              var h = date.getHours();
              var m = date.getMinutes();
              if(m < 10) {m = '0'+m;} 
              $(this).html(h+':'+m); 
            };
            s = 1; //--- after 1st td increase ---

      }
   });
});

JSFiddle