Question

我遇到了一个似乎应该相对简单易于解决的问题，但到目前为止我的答案已经没有了。

我正在使用SignalR将新的局部视图返回到主页面。使用新信息更新数据库时，将调用使用新的部分视图更新div标记的客户端函数。到目前为止一切都很好。

现在我想添加更多JQuery代码来隐藏/显示我的表中显示在局部视图中的子行。

问题是到目前为止，我只能让一个或另一个脚本工作。如果我让表显示/隐藏功能正常工作，它会破坏我的signalR脚本，因此当服务器触发时我不再接收更新的部分视图。同样，当signalR正常工作时，我无法再激活显示/隐藏功能。

SignalR似乎使用旧版本的JQuery，但是为了使我添加的脚本能够工作，我必须添加对jquery-1.10.2的引用。 SignalR不需要jquery引用，它只需要jquery-signalR-2.1.2引用。

所有这些脚本都位于显示局部视图的主页面上，而不是局部视图。

我也尝试过使用JQuery与这两个脚本没有冲突但无济于事。

它似乎与两个版本的JQuery同时被引用有关，但我不确定从这里开始使两个脚本一起工作。无论哪个脚本首先放置，都是有效的。

这是signalR脚本，只有它的依赖项：

<script src="/Scripts/jquery.signalR-2.1.2.js"></script>
<!--Reference the autogenerated SignalR hub script. -->
<script src="/signalr/hubs"></script>
<script type="text/javascript">
    $(function () {
        // Declare a proxy to reference the hub.
        var notifications = $.connection.monitoringHub;

        //debugger;
        // Create a function that the hub can call to broadcast messages.
        notifications.client.updateDetails = function () {
            getDetails()
        };
        // Start the connection.
        $.connection.hub.start().done(function () {
            //alert("connection started")
            getDetails();
        }).fail(function (e) {
            alert(e);
        });
    });

    function getDetails() {
        var tbl = $('#systemDetails');
        $.ajax({
            url: '/Monitoring/GetDetails/@Model.Customer.SONumber.ToString()',
            contentType: 'application/html ; charset:utf-8',
            type: 'GET',
            dataType: 'html'
        }).success(function (result) {
            tbl.empty().append(result);
        }).error(function () {

        });
    }
</script>

这是我的用户脚本，具有所需的依赖项：

<script src="/Scripts/jquery-1.10.2.js"></script>
    <script type="text/javascript">
        $("body").on("click", "#deviceDetail", function () {
        $(this).closest('tr').next().toggle("slow");
        $(this).toggleClass("glyphicon-plus-sign glyphicon-minus-sign");
    });
    </script>

Answer 1

jquery点击事件$(".glyphicon-plus-sign").click仅针对最初运行脚本（或首次加载页面）时存在于DOM中的项目进行连接。

，以后通过AJAX附加到您的表中的任何项目都不会

我没有您的HTML，但您可以尝试以下内容：

$("body").on("click",".glyphicon-plus-sign", function () {
   $(this).closest('tr').next().toggle("slow");
});

注意：body可能不是最佳选择，这里的想法是在AJAX调用之前将click事件添加到DOM中存在的项目。更好的选择可能是父表标记。

Jquery脚本与SignalR冲突

1 个答案: