与SignalR jQuery脚本冲突(Jquery script conflict with Si

2019-10-21 13:38发布

我遇到的是看起来应该是比较简单的解决,但到目前为止,答案一直困扰我的问题。

我使用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");
});

注意:身体可能不是最好的选择,这里的想法是到单击事件添加到存在于AJAX调用之前的DOM中的项目。 一个更好的选择可能是父表标签。



文章来源: Jquery script conflict with SignalR