jQuery ajax加载标签后回调
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/740652/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Callback after ajax loading a tab
提问by Gerardo
How can I apply some code to the content of an ajax loaded tab? I tried using $(document).ready inside the loaded content, but that prevented css styles from loading (don't know why).
如何将一些代码应用于 ajax 加载选项卡的内容？我尝试在加载的内容中使用 $(document).ready ，但这阻止了 css 样式的加载（不知道为什么）。
Is there a callback function? Should I use $(document).ready and styles inside the loaded document in some other way?
有回调函数吗？我应该以其他方式在加载的文档中使用 $(document).ready 和样式吗？
If using $(document).ready inside the loaded document is fine, should I also include references to jquery and its plugins in it?
如果在加载的文档中使用 $(document).ready 很好，我还应该在其中包含对 jquery 及其插件的引用吗？
回答by kgiannakakis
Have you tried the load event? This should be called, when the contents of the tab have been loaded.
您是否尝试过加载事件？应调用此选项卡的内容时应调用。
In general you shouldn't treat the loaded element as a new page and call the $(document).ready. This is not a new page, but some new elements added to the DOM. All ajax methods feature a callback method that is invoked, when the data are successfully loaded.
通常，您不应将加载的元素视为新页面并调用 $(document).ready。这不是一个新页面，而是一些添加到 DOM 的新元素。所有 ajax 方法都有一个回调方法，当数据成功加载时调用该方法。
回答by Russ Cam
What code are you using to load the content through ajax? If you using a jQuery command like loador ajaxthen I would recommend putting your code inside the callback function. For example, using load
您使用什么代码通过ajax加载内容？如果您使用像load或ajax然后我建议将您的代码放在回调函数中的 jQuery 命令。例如，使用load
$('#myUITab').load('anotherPage.html', function() {
// put the code you need to run when the load completes in here
});
回答by Sun Kim
jQuery UI "Tabs" provide callback method. Check out below!
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
}
}
});
回答by vsync
Another way to do this is by using ajaxComplete:
另一种方法是使用 ajaxComplete：
$("#loading_comtainer").ajaxComplete(function( event,request, settings ){
alert("ajaxCompleted");
});
回答by aberpaul
You can use the tabsload event http://jqueryui.com/demos/tabs/#event-load
您可以使用 tabsload 事件http://jqueryui.com/demos/tabs/#event-load
See how it can work in the example below:
在下面的例子中看看它是如何工作的：
$('#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?');
});
