文件内的窗口加载准备好了吗?
很抱歉,如果之前已经回答了这个问题,但所有搜索都会讨论差异,如果可能的话,不要将两者结合使用。
简单地说, $(window).load.(function() {})
可以在$(document).ready.(function() {})
INSIDE中使用吗?
在加载DOM之后我应该做一些事情但是我想在图像加载完成后才显示某些元素。 在Explorer 8中唯一有效的方法是将$(window).load
函数放在$(document).ready
。
这是一种可接受的做法吗?
我只想使用最可接受的方法来显示包含小图像的DIV
,如工具栏,在完全构造之后。 ( hidden
visibility
与display
none
,例如)。 这个DIV
的HTML由$(document).ready
的代码编写,然后在使用$(window).load
之前使用$('body').append()
附加到body。
我在Explorer 8中遇到了很多问题。
这很好,是一种可接受的做法。 毕竟,正如您所描述的,可能存在$(window).load()
处理程序中的逻辑依赖于DOM准备好之后发生的工作的情况。 如果窗口实际上已经在您设置$(window).load()
时已经加载,则处理程序将立即触发。
编辑:
注意:此答案仅适用于jQuery v2及更低版本。
jQuery .ready()
事件 :
传递给
.ready()
的处理程序保证 在DOM准备好后执行,因此这通常是附加所有其他事件处理程序并运行其他jQuery代码的最佳位置 。
jQuery .load()
事件方法 :
当
load
和所有子元素已完全加载时,load
事件将发送到元素。 此事件可以发送到与URL关联的任何元素:图像,脚本,框架,iframe和窗口对象。
根据上面的jQuery文档,我没有看到任何表明以下问题的内容:
$(document).ready(function () { // will fire IMMEDIATELY after the DOM is constructed $(window).load(function() { // will only fire AFTER all pages assets have loaded }) });
将.load
置于ready
只会保证在每次触发load
时DOM .load
ready
。
人们可能希望将所有 jQuery代码放在单个DOM就绪处理程序中,但仍然可能有一个jQuery代码子集,需要首先加载所有图像。 这种安排保证所有代码在DOM就绪时触发一次,其余代码将在页面资产完成加载后随后触发。
这最终可能更多地是个人偏好问题,但OP明确询问这种安排是否会引起问题。 事实并非如此。
警告 :这个问题的答案已经过时了。
正如@ViRuSTriNiTy在评论中提到的那样,这个代码在jQuery 3中不再有效,并且它在GitHub上被提到是一个问题。
所以不再建议这种方法。
一种方法是使用以下代码
$(window).on("load", function(){ $.ready.then(function(){ // Both ready and loaded }); })
但是,如果您准备好加载图像并希望在完全加载后调用某些代码,则此代码将不起作用。
我最近遇到了这个问题…从jQuery版本3开始 ,我们不能再将$(window).on(’load’)放在document.ready()中…因为就绪处理程序是异步调用的,这意味着就绪加载后调用。
来自jQuery Core Team : Github:jQuery 3问题
要清楚,我们理解是什么导致了这一点。 我们最近准备好处理程序异步启动。 这具有难以放弃的优点。 缺点是如果load事件足够快地触发,就绪处理程序有时会在load事件之后触发。 您在此问题中看到的副作用是您在加载事件已触发后绑定加载事件处理程序。
修复是将负载绑定到就绪之外。
这就是应该调用这两种方法的方法:
$(function() { // Things that need to happen when the document is ready }); $(window).on("load", function() { // Things that need to happen after full load });