Question

我曾经使用不同的可识别行来使用SignalR更新此表：

$(document).ready(function () {
    //Enable logging
    $.connection.hub.logging = true;

    // Proxy created on the fly
    var messageHub = $.connection.messageHub;
    messageHub.client.timeEnabled = true;

    // ... Removed main part of the body ...

$.connection.hub.start(function () {
        var table = document.getElementById("monitorList");
        for (var i = 0, row; row = table.rows[i]; i++) {
            var item = document.getElementById("conveyanceId-" + i).innerHTML;
            messageHub.server.joinGroup(item);
        }
})

现在，结构已经改变了，而不是使用表格，我使用的是div，每个容器都有一个唯一的id：container-@unit.UnitId：

<div class="container">
    <div class="row">
        <div class="col-md-12">
            @for (int i = 0; i < @Model.UnitDetails.Count; i++)
            {
                var unit = Model.UnitDetails[i];
                <div class="panel panel-inverse sl-unit-overview" id="container-@unit.UnitId">
                    <div class="panel-heading">
                        <!-- Heading content -->
                    </div>
                    <div class="panel-body">
                        <!-- Body content -->
                    </div>
                </div>
            }
        </div>
    </div>
</div>

我的问题，我想这更像是两个问题： 1.如何更改我的javascript以找到每个容器，就像我对表一样？ 2.我目前的做法是正确的做法吗？（感觉有点不确定）

Answer 1

你可以使用getElementsByClassName，它返回一个包含该类dom中所有项目的数组，然后你可以迭代该类。当然，您需要向要选择的div添加一个类（class: "name"）。

请在此处查看示例：How to get current element in getElementsByClassName

至于2，我认为你做得很好，但是如果可能的话会推荐使用JQuery（一些原生的js不适用于所有浏览器）。请参阅：http://api.jquery.com/class-selector/

Answer 2

解决了它：）

$.connection.hub.start(function () {
        $("#unitList > div[id]").each(function() {
            var unitId = this.id;
            messageHub.server.joinGroup(unitId);
        });
}).done(function () { console.log('Now connected, connection ID=' + $.connection.hub.id); })
    .fail(function () { console.log('Could not Connect'); });

如何使用SignalR更新几个div？

2 个答案: