Question

如何将一些代码应用于加载ajax的选项卡的内容？我尝试在加载的内容中使用$（document）.ready，但这阻止了加载css样式（不知道为什么）。

是否有回调功能？我应该以其他方式在加载的文档中使用$（document）.ready和styles吗？

如果在加载的文档中使用$（document）.ready很好，我是否还应该在其中包含对jquery及其插件的引用？

Answer 1

你试过load event吗？当加载选项卡的内容时，应调用此方法。

通常，您不应将已加载的元素视为新页面并调用$（document）.ready。这不是新页面，而是添加到DOM的一些新元素。所有ajax方法都具有一个在成功加载数据时调用的回调方法。

Answer 2

您使用什么代码通过ajax加载内容？如果您使用jQuery命令，如load或ajax，那么我建议您将代码放在回调函数中。例如，使用load

$('#myUITab').load('anotherPage.html', function() {

    // put the code you need to run when the load completes in here

});

Answer 3

jQuery UI“Tabs”提供回调方法。请查看以下内容！

$( "#tabs" ).tabs({
    ajaxOptions: {
        error: function( xhr, status, index, anchor ) {
            $( anchor.hash ).html(
                "error occured while ajax loading.");
        },
        success: function( xhr, status ) {
            //alert("ajax success. ");    //your code
        }
    }
});

Answer 4

另一种方法是使用ajaxComplete：

$("#loading_comtainer").ajaxComplete(function( event,request, settings ){
   alert("ajaxCompleted");
});

Answer 5

您可以使用tabsload事件http://jqueryui.com/demos/tabs/#event-load

在下面的示例中了解它的工作原理：

$('#nav_tabs').tabs({
    select: function(event, ui){
        var url = $.data(ui.tab, 'load.tabs');
        if (url == '?ak=/account/logout') { 
            //exclude the logout from using ajax
            location.href = url;
            return false;
        }
        return true;
    },
}).bind('tabsload',function(event, ui){
    alert('The tab is loaded. What now?');
});

ajax加载选项卡后回调

5 个答案: