javascript - 将变量分配给不断变化的 div

Question

我有一个显示用户发送的消息的 div ( <div id="messages"></div> )。我正在尝试将变量“msg”分配给 div 中消息的值，但不幸的是，“msg”没有注册添加到 div 的新消息的值。

因此，每次我在控制台中键入“msg”时，即使 div 中有一条消息，它也会返回“undefined”。

这是我目前的情况

var msg;
document.getElementById("#messages").onchange = function () {
    msg = this.textContent;
    // I soon found out that this code only works for <inputs> and not <div>
}

这是消息模板

<div class="message"> + message.body + </div>

有什么建议吗？

问题是，当页面加载并且我向消息 div 发送一条消息，然后在我的控制台中输入“msg”时，我收到“未定义”，因为该变量尚未注册消息 div 具有更改/更新。 所以基本上我正在寻找一种方法，让 javascript 将 var msg 分配给 #messages，以便在添加新的 .message 时重新加载/更新。

Answer 1

检查这个 fiddle 。你说:

I'm trying to assign a variable 'msg' to the value of the messages in the div but unfortunately the 'msg' doesn't register the value of the new messages added to the div.

所以在 fiddle 中，我创建了一个消息模拟并使用了 triggerHandler从 jQuery 将消息分配给变量，msg当新消息到达时。您可以阅读更多关于 triggerHandler 的信息这里:http://api.jquery.com/triggerHandler

代码:

setTimeout(function () { // Simulating a new message after 2 seconds
    $('#message').html("I am a new message!!!").triggerHandler('newMsg');
}, 2000);

var msg;

$('#message').on('newMsg', function () {

    msg = $(this).html();
    alert("NEW MESSAGE: " + msg);
});