jQuery Time Ago

我在如何更新我的網站發佈會議紀要方面有點麻煩。jQuery Time Ago

所以說，我有這樣的：

<small>posted <span class="updateMinutes">20 minutes </span> ago</small> 
<small>posted <span class="updateMinutes">33 minutes </span> ago</small>

我試圖更新範圍內的分鐘。我遇到的問題是，只有一個跨度更新，而另一個不更新。我的jQuery代碼如下：

setInterval(function(){ 
      var minute = $('.updateMinutes').text().match(/\d+/); 
      $('.updateMinutes').html((parseInt(minute[0]) + 1).toString() + ' minutes'); 
}, 60000);

我也對.each()方法的jQuery閱讀起來了，但我不知道我怎麼會實現它在這種情況下，如果這將是一個可行的解決方案。代碼我嘗試使用時.each()：

setInterval(function(){ 
     $('.updateMinutes').each(function(){ 
      var minute = $('.updateMinutes').text().match(/\d+/); 
      $('.updateMinutes').html((parseInt(minute[0]) + 1).toString() + ' minutes'); 
     }); 
}, 60000);

任何幫助非常感謝！謝謝。

來源

2014-12-31 Brian Moreno

它看起來像你有'min [0]'而不是'minute [0]' –

'min [0]'是一個錯誤...結果在'minute [0]' –

是的，我注意到了謝謝我糾正它。我本來有分鐘的意思：p。 –

的主要問題沒有在您的each內提及this。將選擇器更改爲$(this)將解決此問題。

注：你並不需要一個each作爲html()可以採取返回每個元素的字符串的函數：

setInterval(function() { 
    $('.updateMinutes').html(function() { 
     var minute = $(this).text().match(/\d+/); 
     return (parseInt(minute[0]) + 1).toString() + ' minutes'; 
    }); 
}, 60000);

的jsfiddle：http://jsfiddle.net/TrueBlueAussie/u707zkxo/1/

注：經過從間隔時間不可靠，所以當頁面呈現時，你更好地記錄「現在」，並顯示從那時起經過的秒數。

來源

2014-12-31 19:44:13

我強烈建議簡化您的流程並使用Moment.js。

你只需要做到：

moment([2014, 10, 31]).fromNow(); // 2 months ago

來源

2014-12-31 19:41:40 Justin

這應該是一個評論，而不是一個答案。 – blockhead

如果我只說：「使用Moment.js」，這將是一個很好的評論。我解釋了爲什麼用一個小代碼例子，對我來說聽起來像是一個答案（如果OP認爲這將是一個更好的方法）。 – Justin

在你.each都需要在特定元素上進行更新。您現在只需將您的常規選擇器代碼放入其中，但如果您使用$(this)而不是$('.updateMinutes')，則會更接近您想要的。即

setInterval(function(){ 
     $('.updateMinutes').each(function(){ 
      var $currentEl = $(this); 
      var minute = $currentEl.text().match(/\d+/); 
      $currentEl.html((parseInt(minute[0]) + 1).toString() + ' minutes'); 
     }); 
}, 60000);

注意setInterval不能保證在間隔傳遞準確射擊，所以你可能會得到你的櫃檯一些時間漂移。

來源

2014-12-31 19:41:58 jball

正如評論指出，下面的代碼工作正常上的jsfiddle：

HTML：

<small>posted <span class="updateMinutes">33 seconds</span> ago</small> 
<small>posted <span class="updateMinutes">33 seconds</span> ago</small>

JS：

setInterval(function(){ 
     $('.updateMinutes').each(function(){ 
      var minute = $(this).text().match(/\d+/); 
      $(this).html((parseInt(minute[0]) + 1).toString() + ' minutes'); 
     }); 
}, 1000);

（設置在第二區間用於演示目的）

小提琴在這裏：http://jsfiddle.net/e5och57u/

在你原來的職位分鐘[0]是一個錯誤，應該已經分鐘[0]，否則它工作正常

來源

2014-12-31 19:42:18 Pseudonym

如果時間相同，它會起作用。但是，如果我在20分鐘前發佈了一個，而另一個30則只會在20分鐘前更新發布的那個。 –

Ahhhh誤解了，更正後的代碼反映 – Pseudonym

我剛纔編輯你的代碼，所以它的工作：

$(document).ready(function() { 
function updateMins() { 
    $('.updateMinutes').each(function() { 
     var minute = $(this).text().match(/\d+/); 
     $(this).html((parseInt(minute[0]) + 1).toString() + ' minutes'); 
    }); 
} 

setInterval(updateMins, 60000); 
});

來源

2014-12-31 19:43:04

謝謝！現在正在工作。 :) –

回答

相關問題