Обратный вызов после загрузки вкладки ajax

Question

Как я могу применить некоторый код к содержимому вкладки, загруженной ajax?Я попытался использовать $(document).готово внутри загруженного содержимого, но это помешало загрузке стилей css (не знаю почему).

Существует ли функция обратного вызова?Должен ли я использовать $(document).готов и стилизует внутри загруженного документа каким-либо другим способом?

Если используется $(document).готово внутри загруженного документа - это нормально, должен ли я также включить в него ссылки на jquery и его плагины?

Answer 1

Вы пробовали использовать событие загрузки?Это должно быть вызвано, когда содержимое вкладки будет загружено.

В общем, вы не должны рассматривать загруженный элемент как новую страницу и вызывать $(document).готово.Это не новая страница, а некоторые новые элементы, добавленные в 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 предоставляют метод обратного вызова.Проверьте ниже!

$( "#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?');
});