AJAX के बाद कॉलबैक एक टैब लोड हो रहा है

Question

मैं AJAX लोड किए गए टैब की सामग्री पर कुछ कोड कैसे लागू कर सकता हूं? मैंने लोड की गई सामग्री के अंदर $ (दस्तावेज़) .ready का उपयोग करने की कोशिश की, लेकिन इससे सीएसएस शैलियों को लोड होने से रोका गया (पता नहीं क्यों)।

क्या कोई कॉलबैक फ़ंक्शन है? क्या मुझे किसी अन्य तरीके से लोड किए गए दस्तावेज़ के अंदर $ (दस्तावेज़) .ready और शैलियों का उपयोग करना चाहिए?

यदि $ (दस्तावेज़) का उपयोग करना है। लोड किए गए दस्तावेज़ के अंदर पहले से ही ठीक है, तो क्या मुझे इसमें jquery और इसके प्लगइन के संदर्भ भी शामिल करना चाहिए?

Answer 1

आप load event की कोशिश की? यह कहा जाना चाहिए, जब टैब की सामग्री लोड हो गई है।

सामान्य रूप से आपको लोड किए गए तत्व को नए पृष्ठ के रूप में नहीं मानना ​​चाहिए और $ (दस्तावेज़) .ready को कॉल करना चाहिए। यह एक नया पृष्ठ नहीं है, लेकिन कुछ नए तत्व डीओएम में जोड़े गए हैं। सभी AJAX विधियों में एक कॉलबैक विधि होती है जिसे लागू किया जाता है, जब डेटा सफलतापूर्वक लोड हो जाता है।

Answer 2

AJAX के माध्यम से सामग्री को लोड करने के लिए आप किस कोड का उपयोग कर रहे हैं? यदि आप load या ajax जैसे jQuery कमांड का उपयोग करते हैं तो मैं आपके कोड को कॉलबैक फ़ंक्शन के अंदर डालने की अनुशंसा करता हूं। उदाहरण के लिए, का उपयोग कर load

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

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

}); 

Answer 3

यह करने के लिए एक और तरीका है ajaxComplete का उपयोग करना है:

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

Answer 4

आप 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?'); 
}); 

Answer 5

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 
     } 
    } 
});