jQuery AJAX 加载内容后加载脚本？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8812970/
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
Load scripts after AJAX loads content?
提问by Charlie
I'm using jQueryand YQLto get the content of a website and display a certain element on the page, in this case, the tableelement. I also have a search function set up using the jQuery QuickSearchplugin.
我正在使用jQuery和YQL获取网站的内容并在页面上显示某个元素，在本例中为table元素。我还有一个使用jQuery QuickSearch插件设置的搜索功能。
This works great, and now to the problem...
这很好用，现在解决问题......
It seems that the search script is loading before the AJAXcontent getter gets the content. I think the script then caches the data, so that it's easier to search. Since it's loading after the content is there though, it doesn't search anything and it doesn't work. Is there any way to load the search script AFTERthe AJAXcontent is loaded?
似乎在AJAX内容获取器获取内容之前正在加载搜索脚本。我认为脚本然后缓存数据，以便更容易搜索。由于它在内容存在之后加载，因此它不会搜索任何内容并且不起作用。有什么办法来加载搜索脚本后的AJAX内容加载？
I already attempted calling it via the readyfunction in jQ:
我已经尝试通过readyjQ 中的函数调用它：
$(document).ready(function() {
But that still loads before the content is loaded. My AJAXscript is below:
但这仍然会在加载内容之前加载。我的AJAX脚本如下：
<script type="text/javascript">
$(document).ready(function () {
var container = $('#content');
function doAjax(url) {
if (url.match('^http')) {
$.getJSON("http://query.yahooapis.com/v1/public/yql?"+
"q=select%20*%20from%20html%20where%20url%3D%22"+
encodeURIComponent(url)+
"%22&format=xml'&callback=?",
function (data) {
if (data.results[0]) {
var fullResponse = $(filterData(data.results[0])),
justTable = fullResponse.find("table");
container.append(justTable);
} else {
var errormsg = '<p>Error: could not load the page.</p>';
container.html(errormsg);
}
});
} else {
$('#content').load(url);
}
}
function filterData(data) {
data = data.replace(/<?\/body[^>]*>/g, '');
data = data.replace(/[\r|\n]+/g, '');
data = data.replace(/<--[\S\s]*?-->/g, '');
data = data.replace(/<noscript[^>]*>[\S\s]*?<\/noscript>/g, '');
data = data.replace(/<script[^>]*>[\S\s]*?<\/script>/g, '');
data = data.replace(/<script.*\/>/, '');
data = data.replace(/<img[^>]*>/g, '');
return data;
}
doAjax('url_goes_here');
});
</script>
回答by adeneo
Not sure I really get the question, but to load a script after the content is loaded with Ajax you could do something like this:
不确定我是否真的明白这个问题，但是要在使用 Ajax 加载内容后加载脚本，您可以执行以下操作：
$.ajax({
url: url,
data: data,
success: function() {
//success loading content
},
error: function() {
//error loading content
},
complete: function() {
$.getScript("/scripts/mysearchscript.js", function() {
alert('loaded script and content');
});
}
});
回答by Travis J
"If .ready() is called after the DOM has been initialized, the new handler passed in will be executed immediately." - http://api.jquery.com/ready/
“如果 .ready() 在 DOM 初始化后被调用，传入的新处理程序将立即执行。” - http://api.jquery.com/ready/
EDIT
编辑
I think I may have misinterpreted your question, sorry. Are you saying that the search tries to search before the table is fully loaded? I thought you were trying to search before the page had completed loading. Have you tried using a callback function attached to your .load(), or just after container.append()?
我想我可能误解了你的问题，抱歉。你是说搜索在表完全加载之前尝试搜索吗？我以为您是在页面加载完成之前尝试搜索。您是否尝试过使用附加到 .load() 或在 container.append() 之后的回调函数？
after load
加载后
$('#content').load(url,callSearchFunction());
you can do it much simpler after append
追加后你可以做的更简单
container.append(justTable);
callSearchFunction();
回答by Ronyn
$('.container').load('yourPage.html',function(){
//Do whatever you want here
});
You can pass an anonymous function like a parameter on the jquery method .load()
您可以在 jquery 方法 .load() 上传递一个匿名函数，如参数
That function will execute when the ajax request is complete
该函数将在 ajax 请求完成时执行
