选项卡 Ajax 响应加载到错误的窗格中

Question

我在选项卡中的 Ajax 请求有问题。选项卡的内容通过 Ajax 请求加载。如果用户在选项卡上快速单击和浏览，并且在收到上一个单击的选项卡的 Ajax 响应之前，则内容将加载到错误的选项卡窗格中，而不是在其窗格中。

当请求成功运行时，似乎每个 ajax 请求的tb_paneID都会更改。

这是代码：

$(".nav-tabs [data-url]").on('click', function() {
tb_loadUrl = $(this).data('url');
tb_paneID = $(this).attr('href');
$.ajax({
url: tb_loadUrl, 
success: function(data) {
$(tb_paneID).html(data);
}
});
});

如何解决这个问题？

Answer 1

您使用的是全局变量，这就是为什么每当在上一个 ajax 调用完成之前触发新的 click 事件时，tb_panelID都会更新。试试这个

$(".nav-tabs [data-url]").on('click', function() {
var tb_loadUrl = $(this).data('url');
var tb_paneID = $(this).attr('href');
$.ajax({
url: tb_loadUrl, 
success: function(data) {
$(tb_paneID).html(data);
}
});
});