Question

jQuery UI tabs个选项有ajaxOptions。

我有下一个代码：

$('#tabs').tabs({
    cookie:{expires:1},
    cache:true,
    ajaxOptions:{
        beforeSend: function(xhr,settings){
            $(".ajax-gif").css("top",$(window).scrollTop()).show();
        },
        error: function(xhr,status,index,anchor){
            $(anchor.hash).html("Couldn't load this tab.");
        },
        complete: function(xhr,textStatus){
            $(".ajax-gif").hide();
        }
    }
});

但是ajax-gif没有出现。

jQuery中的相同代码ajaxSetup（没有jQuery UI）适用于通常的ajax请求（不在ui选项卡中）。我在哪里弄错了？

谢谢！

澄清

通常的ajax请求使用POST表单，而标签使用GET表单。

Answer 1

您使用的是哪个版本的jQuery UI标签？ ajaxOptions选项仅适用于1.8版本，您可以在http://api.jqueryui.com/1.8/tabs看到。

对于当前版本（1.11），您将使用beforeLoad属性。像这样：

$('#tabs').tabs({
    beforeLoad: function (event, ui) {

        $(".ajax-gif").css("top",$(window).scrollTop()).show();

        ui.jqXHR.complete(function(data) {
            $(".ajax-gif").hide();
        });

        ui.jqXHR.error(function(data) {
            $(anchor.hash).html("Couldn't load this tab.");
        });
    }
});

Answer 2

我找到了解决方案：

$(document).ajaxSend(function(){
    $(".ajax-gif").css("top",$(window).scrollTop()).show();
});
$(document).ajaxComplete(function(){
    $(".ajax-gif").hide();
});

jQuery UI选项卡：ajaxOption不能正常工作

2 个答案: