jQuery 在所有 $(document).ready() 运行之后，是否有一个事件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3008696/
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
After all $(document).ready() have run, is there an event for that?
提问by mjsilva
I have a first.js file included in the page index.php that have something like this:
我有一个包含在页面 index.php 中的 first.js 文件，它有这样的内容：
$(function(){
$("#my_slider").slider("value", 10);
});
And them in index.php I have some dynamicly created slidders:
他们在 index.php 我有一些动态创建的滑块：
<?php function slidders($config, $addon)
{
$return = '
<script type="text/javascript">
$(function() {
$("#slider_'.$addon['p_cod'].'").slider({
min: '.$config['min'].',
max: '.$config['max'].',
step: '.$config['step'].',
slide: function(event, ui) {
$("#cod_'.$addon['p_cod'].'").val(ui.value);
$(".cod_'.$addon['p_cod'].'").html(ui.value+"'.@$unit.'");
},
change: function(event, ui) {
$("#cod_'.$addon['p_cod'].'").change();
}
});
$("#cod_'.$addon['p_cod'].'").val($("#slider_'.$addon['p_cod'].'").slider("value"));
$(".cod_'.$addon['p_cod'].'").html($("#slider_'.$addon['p_cod'].'").slider("value")+"'.@$unit.'");
});
</script>';
return $return;
} ?>
The problem is, because my index.php sliders are being instantiated after my first.js I can't set up a value there, is there any event like "after all $(document).ready() have run" that I can use in first.js to manipulate the sliders created in index.php?
问题是，因为我的 index.php 滑块是在我的 first.js 之后实例化的，所以我无法在那里设置值，是否有任何类似“在 $(document).ready() 运行之后”之类的事件我可以在 first.js 中使用来操作在 index.php 中创建的滑块？
回答by John Hartsock
Dont know how to tell when the last $(document).ready()function fired, but $(window).load()function fires after the $(document).ready()
不知道如何判断最后一个$(document).ready()函数何时触发，但$(window).load()函数在$(document).ready()
回答by Thaeli
The safest thing to do is to invoke $(window).load()inside$(document).ready(). This will preserve execution order in all cases by making sure that your run-last code is not passed to $(window).load()until all $(document).ready()scripts have completed. Without this there are possible race conditions in some browsers where $(window).load()may be invoked after all $(document).ready()scripts have startedbut before all $(document).ready()scripts have finished.
最安全的做法是调用$(window).load()inside$(document).ready()。这将通过确保$(window).load()在所有$(document).ready()脚本完成之前不会传递到最后运行的代码，从而在所有情况下保持执行顺序。如果没有这个，在某些浏览器中$(window).load()可能会出现竞争条件，可能会在所有$(document).ready()脚本启动之后但在所有$(document).ready()脚本完成之前调用。
$(document).ready(function() {
$(window).load(function() {
// this code will run after all other $(document).ready() scripts
// have completely finished, AND all page elements are fully loaded.
});
});
回答by Matmarbon
Based on Ian's answer I figured this out (tested - working):
根据伊恩的回答，我想出了这个（测试 - 工作）：
jQuery(document).ready(function() {
jQuery(document).ready(function() {
/* CODE HERE IS EXECUTED AS THE LAST .ready-CALLBACK */
});
});
Of course this is because the ready callbacks are invoked in the order they where assigned. At the moment, when your outer ready callback is invoked, all other scripts should have their ready callbacks already assigned. So assigning your ready callback (the inner one) nowwill lead to yours being the last one.
当然，这是因为就绪回调是按照它们分配的顺序调用的。目前，当您的外部就绪回调被调用时，所有其他脚本都应该已经分配了它们的就绪回调。所以，你的分配准备的回调（内一个）现在会导致你是最后一个。
回答by Toby
Try this neat trick/gross hack:
试试这个巧妙的技巧/粗暴的黑客：
$(function(){
$(function(){
$("#my_slider").slider("value", 10);
});
});
Looks stupid right? It works because jQuery executes event handlers in the order they were added. Adding an event handler in your event handler is about as late as you can (just make sure you're not doing this on any of the sliders accidentally; it's very easy to do).
看起来很傻吧？之所以有效，是因为 jQuery 按添加顺序执行事件处理程序。在您的事件处理程序中添加事件处理程序是尽可能晚的（只要确保您没有在任何滑块上意外执行此操作；这很容易做到）。
Proof of concept. http://jsfiddle.net/9HhnX/
回答by Jacob Mattison
One of the goals of jQuery's $(document).ready() function is that the standard javascript window.onload event won't run until everything on the page is loaded (including images, etc.), even though functions can usefully start running well before that. So $(document).ready() runs as soon as the DOM hierarchy is constructed.
jQuery 的 $(document).ready() 函数的目标之一是标准的 javascript window.onload 事件在页面上的所有内容（包括图像等）都被加载之前不会运行，即使函数可以有用地开始运行在那之前。所以 $(document).ready() 会在 DOM 层次结构构建后立即运行。
Given this, one option would be to run your "after everything else" script on page load. This won't guarantee that all of the $(document).ready() scripts have completed, though.
鉴于此，一种选择是在页面加载时运行您的“在其他一切之后”脚本。但这并不能保证所有 $(document).ready() 脚本都已完成。
A better but more complicated option is to create a function that checks for the existence of the sliders, and if they don't exist, calls "setTimeout" on itself, so it can wait a few milliseconds and try again.
一个更好但更复杂的选择是创建一个函数来检查滑块是否存在，如果它们不存在，则对自身调用“setTimeout”，因此它可以等待几毫秒并重试。
(To answer your specific question, no, there is no "after all $(document).ready() have run" callback.)
（要回答您的具体问题，不，没有“毕竟 $(document).ready() 已经运行”回调。）
回答by darren102
You would be better to add a unique class to your sliders rather than the #my_slider since that will only fire for the element with id = my_slider.
您最好为滑块添加一个独特的类，而不是 #my_slider，因为它只会为 id = my_slider 的元素触发。
If you want to have the same functionality you should check out .live from jquery it will put the same functionality onto elements that are added after the binding.
如果你想拥有相同的功能，你应该从 jquery 中查看 .live 它将把相同的功能放在绑定后添加的元素上。
If that will not work for you then when you add the new sliders you will have to go through them in the DOM and call the necessary function.
如果这对您不起作用，那么当您添加新滑块时，您将不得不在 DOM 中遍历它们并调用必要的函数。
