我遇到了一个问题,该问题似乎应该相对简单解决,但到目前为止,答案仍在我眼前。
我正在使用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>
$(".glyphicon-plus-sign").click
仅在最初运行脚本(或首次加载页面)时,才会为DOM中存在的项目连接jquery click事件。以后通过AJAX附加到表格中的任何项目都不会连接该事件。
我没有您的html,但是您可以尝试以下操作:
$("body").on("click",".glyphicon-plus-sign", function () {
$(this).closest('tr').next().toggle("slow");
});
注意:body可能不是最佳选择,这里的想法是在AJAX调用之前将click事件添加到DOM中存在的项目中。更好的选择可能是父表标签。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句