使用刷新更新表 [英] Updating Table with Refresh

问题描述

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

所以基本上原来的信息如下

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

3秒后应该是

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

这是小提琴我已经做了。

我是不能做到这一点我试图做一个函数，其中我增加表值并调用该函数

setInterval（updateFunction，3000）;

但没有运气。这就是我在创造一个函数的方式。

  var cell = $（＃example）; 
 var currentVal = parseInt（cell.text（），10）; 
 cell.text（currentVal + 1）; 
  

有人可以提供一些建议。我很喜欢js和jquery，如果难以理解，我可以澄清我的意思，也很抱歉。

解决方案

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

 < 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（index）{
 var cur = parseInt（$（this）.text（），10） function UpdateFunction（）{
 $（。updateMeInt ; 
 $（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 （秒））; 
 
}）; 
} 
  

更新 FIDDLE

I have a jquery app which consist of a table. The table has a time field and some number fields. I want to basically increment the values every 3 seconds. So i was thinking of creating a function where i increment the number values and calling it via refresh functions that auto refreshes every 3 seconds.

so basically originally the information is as follows

Kobe Bryant 10:00 30 4 2

after 3 seconds it should be

Kobe Bryant 10:03 31 5 4

This is the Fiddle i have made.

I was not able to do this. I tried to make a function where i increase the table values and call that function as such

setInterval(updateFunction, 3000);

but no luck. This is how i was thinking of creating a function.

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

Can anyone please provide some advice. I am new to js and jquery and also sorry for poor english if its hard to understand i can clarify what i mean.

解决方案

Here is a way. Add classes to the cells that need updating:

<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>

In this example, the class updateMeInt means it is a simple integer, and updateMeTime means it is a time value.

Then your update function would iterate through each cell with these classes and increment:

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)); 

    });
} 

Updated FIDDLE

这篇关于使用刷新更新表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！