在div元素中更新Momentjs FromNow（）

我使用此div元素顯示自創建以來的時間。但它並沒有得到更新，並且在幾秒前仍然在上。它看起來像這樣在div元素中更新Momentjs FromNow（）

var newMsg= "<div id="chat-time">'+ moment().fromNow()+'</div>"; 
$("#chat-list").html(newMsg);

如何更新此文本。我知道我可以用sentInterval做到這一點，但我無法弄清楚如何正確地做到這一點。它只是打印秒數！我正在使用這個聊天室。所以每條消息都會有一個timejs.fromNow（）格式的時間戳。爲所有這些消息設置計時器是否會產生問題？我會欣賞一個提示。

編輯：我使用的是如下提到這個代碼，但它沒有顯示任何東西：既然你正在使用socket.io，你

<div id="chat-time"></div> 

var messageTimeStamp = new Date(); 
setInterval(function(){ 
    var time = moment(messageTimeStamp).fromNow(); 

    $("#chat-time").html(time); 
}, 1000);

來源

2015-10-22 Hirad Roshandel

該代碼沒有意義，請展示它的使用的完整上下文。 'setInterval（）'爲每次使用返回一個唯一的標識符，所以它可以被取消。您的代碼永遠不會將'moment（）'值返回給字符串 – charlietfl

@charlietfl，那麼我如何每秒更新一次該文本？ –

@HiradRoshandel讓我知道如果我的答案不適合你。我也提供了一個演示。 –

更新2

倒是做這樣的事情（演示：http://plnkr.co/edit/QuaMV6x1vNB0kYPaU6i1?p=preview）：

// The messages the user can currently see. 
    var messages = []; 

    // You have something like this in your code, presumably. 
    socket.on('new message', function(data) { 
    addChatMessage(data); 
    }); 

    function addChatMessage(data) { 
    // First add the message to the dome, with a unique id for the timestamp text. 
    var messageElementId = 'chat-message-' + data.messageId; 
    $("#chat-list").prepend($("<div>" + data.message + "<i> (sent: <span id='" + messageElementId + "'>just now</span>)</i></div>")); 

    // When you no longer display that message in the DOM it from clear this array. I'd render the DOM based on this list if I were you. 
    messages.push({ 
     messageElementId: messageElementId, 
     timestamp: data.timestamp 
    }); 
    } 

    // By updating all the messages at once you don't have memory leaks. 
    setInterval(function() { 
    messages.forEach(function(message) { 
     var time = moment(message.timestamp).fromNow(); 
     $("#" + message.messageElementId).text(time); 
    }); 
    }, 1000);

更新1

鑑於這是你的代碼：

var newMsg= "<div id="chat-time">'+ moment().fromNow()+'</div>"; 
$("#chat-list").html(newMsg);

你可以這樣做，而不是：

var messageTimeStamp = new Date(); // You need to grab this from somewhere. 

setInterval(function(){ 
    var time = moment(messageTimeStamp).fromNow();   
    $("#chat-list").html(time); 
}, 1000);

您需要使用moment(TIMESTAMP_OF_MESSAGE)不moment()做像這樣：

$(function(){ 
    $("body").append($('<div id="chat-time"></div>')); 

    var messageTimeStamp = new Date(); 
    var i = 0; 
    setInterval(function(){ 
    var time = moment(messageTimeStamp).fromNow(); 

    $("#chat-time").html('moment().from(messageTimeStamp): ' + time + '; setInterval calls made ' + i++); 
    }, 1000); 
});

下面是演示。

http://plnkr.co/edit/QuaMV6x1vNB0kYPaU6i1?p=preview

來源

2015-10-23 00:13:28

它不起作用。它顯示沒有結果： - /我更新我的問題與您的代碼 –

爲了使這項工作，你需要在DOM和元素setInterval運行沒有被列入任何字符串連接

HTML

<div id="chat-time"></div>

var $chatTime = $('#chat-time').text(moment().fromNow()); 
setInterval(function(){ 
    var time = moment().fromNow(); 
    $chatTime.txt(time); 
}, 1000);

來源

2015-10-23 00:14:03 charlietfl

它不起作用。它不顯示任何東西 –

-1

我沒有看到任何問題usi ng setInterval()。 $ interval服務模塊上的AngularJS包裝setInterval。看看這些網址：interval Angular和Wrapper SetInterval

來源

2015-10-23 00:28:20

我沒有使用角度 –

我明白。但我只是想告訴你，這不是醜陋的使用setInterval。像Jared這樣的詞語對我來說就像是一種魅力。 –

我明白了，但在agular中重新編寫所有代碼並不是這個問題的答案。謝謝。順便說一句，downvote不是我的。 –

在div元素中更新Momentjs FromNow（）

回答

相關問題