我用jQuery也快2个月了,今天无聊的时候想弄懂 ready方法的机制发现此问题想了3小时无果来论坛求点拨一下废话不多说了下面贴代码<script>
for(var i=0;i<3;i++){
alert(i);
$(document).ready(function(){
alert('第'+i+'个ready');
});
}
alert('3333');
</script>这边我专门还翻了一下jquery的API 上面说: 当 DOM(文档对象模型) 已经加载,并且页面(包括图像)已经完全呈现时,会发生 ready 事件。这边贴的代码结果是
0
1
2
3333
第3个ready
第3个ready
第3个ready
循环里面没有执行ready方法(能理解 文档还没有加载完嘛)
但是相当不能理解是在打印完 0 1 2后i的值都成3(这点在 第3个ready可以证实)了,并不满足循环条件了为什么 在输出了 0 1 2 3333后 ready方法依然能执行3此jquery
for(var i=0;i<3;i++){
alert(i);
$(document).ready(function(){
alert('第'+i+'个ready');
});
}
alert('3333');
</script>这边我专门还翻了一下jquery的API 上面说: 当 DOM(文档对象模型) 已经加载,并且页面(包括图像)已经完全呈现时,会发生 ready 事件。这边贴的代码结果是
0
1
2
3333
第3个ready
第3个ready
第3个ready
循环里面没有执行ready方法(能理解 文档还没有加载完嘛)
但是相当不能理解是在打印完 0 1 2后i的值都成3(这点在 第3个ready可以证实)了,并不满足循环条件了为什么 在输出了 0 1 2 3333后 ready方法依然能执行3此jquery
顺便提一句va i 把i声明成了全局变量
(function (idx) {
return $(document).ready(function () { alert('第' + idx + '个ready'); });
})(i);
}
你也说了循环里面没有执行ready方法,
页面完全呈现后才执行ready方法,这时才来读取i的值,这时循环已经结束了,输出的3是循环结束后i的值
LZ是要问为什么ready事件能执行3次是吧?
在jquery中:可以对同一个事件绑定多个函数。
你循环3次。就是对ready事件绑定了3个函数。
当事件触发时,事件绑定的3个函数都会执行。
ready方法为什么还能继续执行3此呢?
ready其实就是这个事件的jQuery写法(当然,那些古代浏览器,需要特殊的代码去兼容,因为他们没有提供这个事件,这是题外话);$(document).ready(function(){}); 等价于:
$(document).on("DOMContentLoaded",function(){});好了,了解了这其实是一个事件注册的话,那是不是问题迎刃而解了?好比对一个div绑定了3次click事件,点击就会触发所有的事件监听器。循环中对DOMContentLoaded事件注册了3次事件监听器,文档加载完毕后,肯定会依次触发这3个监听器了。至于为什么是3个3,楼上的大大们都已经解释清楚了。
var task = [];
function ready(fn) {
task.push(fn);
}
function go() {
var len = task.length;
for ( var i = 0; i < len; i++) {
task[i].call(this);
}
} for ( var i = 0; i < 3; i++) {
alert(i);
ready(function() {
alert('第' + i + '个ready');
});
}
alert('3333'); go();