我使用lab.js 2.0.3并行加载我的脚本。 问题是,在“$(window).load”部分的10次中,有一部分太早发生了。 “$(document).ready”部分工作正常。
示例:
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/labjs/2.0.3/LAB.min.js" type="text/javascript"></script>
<script>
$LAB
.script("script1.js")
.script("script2.js")
.script("script3.js")
.wait(function(){
$(window).load(function() {
// Function 1
$("jQuery Function 1");
// Function 2
$("jQuery Function 2");
});
$(document).ready(function() {
// Function 3
$("jQuery Function 3");
// Function 4
$("jQuery Function 4");
});
});
</script>
我猜,我做错了什么,但不知道是什么:(
答案 0 :(得分:4)
这可能是因为$(window).load()
每页只触发一次。如果你错过了等待脚本加载,你错过了它。因此,在.wait
和.load
之间,您的竞争条件无法确定您是赢还是输。
$(document).ready()
类似于延迟对象,因为可以在事件触发后添加新的回调并且仍然会被调用。
您可以在此处看到此示例:http://jsfiddle.net/coiscir/AFszS/1/
$(window).load(function () {
console.log('outer window.load');
// bind after the event
setTimeout(function () {
$(window).load(function () {
console.log('inner window.load'); // you'll never see this
});
}, 10);
});
如果您希望.ready
与.load
具有类似效果,则可以使用Deferred Object在实际事件和回调之间进行调解:http://jsfiddle.net/coiscir/m4D46/
var windowLoad = $.Deferred();
$(window).load(windowLoad.resolve);
$LAB
.script("script1.js")
.script("script2.js")
.script("script3.js")
.wait(function(){
windowLoad.done(function() {
// Function 1
$("jQuery Function 1");
// Function 2
$("jQuery Function 2");
});
$(document).ready(function() {
// Function 3
$("jQuery Function 3");
// Function 4
$("jQuery Function 4");
});
});