Question

我现在已经被困在一个小问题上了一段时间。我通过stomp客户端设置有弹簧websockets，我收到消息，并尝试在特定元素上调用一个简单的removeClass（）/ addClass（）/ css（）操作。

以下是相关代码：

// Function called on page load
function connectToConfirm() {
    var sck = new SockJS('/endpoint');
    sClient = Stomp.over(sck); 
    sClient.connect({}, function(frame) {
        console.log('Connected: ' + frame);
        sClient.subscribe('/test', function(readyConfirmation) {
            setReady(JSON.parse(readyConfirmation.body));
        });
    });
}

function setReady(content) {
    $('#readyIndicator-'+content.id)
        .addClass('fa-check')
        .removeClass('fa-times')
        .css('color', 'green');
    console.log("ID: " +content.id); 
    // Displays the correct id and shows the function gets called
    console.log("Object exists?: " +$('#readyIndicator-'+content.id).length);
    // Displays "1", therefore an element by that id exists.

}

使用Thymeleaf的HTML。通过HandlerInterceptorAdapter实现添加$ {group}对象，并正确显示值：

<tr th:each="user: ${group.members}">
    <td width="80%" th:text="${user.username}">Username</td>
    <td width="20%">
        <i th:id="readyIndicator- + ${user.id}" class="fa fa-times"
                                style="color: red;"></i>
    </td>
</tr>

我有一个按钮，可以向服务器发送消息并正确返回，例如：

>>> SEND
destination:/app/myMapping/foo
content-length:20

..我收到了回复：

<<< MESSAGE
destination:/test
content-type:application/json;charset=UTF-8
subscription:sub-1
message-id:ffbazdj4-82
content-length:84

{"id":"123", .. , ..}

所以是的，函数被调用但是类没有得到更新，即使元素存在。我真的失去了为什么会发生这种情况。更糟糕的是，我在另一个项目中有类似的实现工作得很好。我真正看到的唯一区别是对象被直接添加到控制器中的模型而不是postHandle（）方法。

通过JQuery更改类不能处理Websocket消息

0 个答案: