首页 > 解决方案 > 为什么这个javascript只替换一次html元素?

问题描述

我正在学习 SignalR,目前正在向所有客户发送定期广播消息。我的广播代码有效,但与我预期的不同。其 appmessage目的是在传输后在所有客户端上简单地显示广播消息。该appclock功能旨在在请求该功能时更新显示的时钟数据。我期待看到我得到的附加列表,以及一个定期更改的clock_data,我只得到一次。

这是我的 javascript 文件:

$(function () {
    var hub = $.connection.broadcastHub;

    hub.client.appmessage = function (message) {
        $('#statusmessages').append($('<li/>').html(message));
    };

    hub.client.appclock = function (message) {
        $('#clock_data').replaceWith(message);
    };

    $.connection.hub.start();
});

以及页面的 HTML:

<p id="clock_data">not set</p>

<p>Manually broadcast messages:</p>
<ul id="statusmessages"></ul>

@Section Scripts
    <script src="/Scripts/jquery-3.3.1.min.js"></script>
    <script src="/Scripts/jquery.signalR-2.2.2.js"></script>
    <script src="/signalr/hubs"></script>
    <script src="/Scripts/Statuses.js"></script>
End Section

客户端 javascriptappmessage函数始终将每条新消息附加到列表中。

客户端 javascriptappclock函数<p>第一次更改元素数据,但此后除非刷新页面,否则不会更改元素。当页面刷新时,它会更改一次元素,然后再次停止更新。

我认为这与我调用集线器连接的方式有关,但我不明白为什么集线器在第一次之后不会继续更新 clock_data 元素。

标签: javascriptjquerysignalr

解决方案


推荐阅读