jQuery 页面加载后如何做jquery代码?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/2926227/
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
How to do jquery code AFTER page loading?
提问by Alex
If you want an event to work on your page, you should call it inside the $(document).ready() function. Everything inside it will load as soon as the DOM is loaded and beforethe page contents are loaded.
如果你想让一个事件在你的页面上工作,你应该在 $(document).ready() 函数中调用它。一旦 DOM 加载完毕且在页面内容加载之前,其中的所有内容都会加载。
I want to do javascript code only afterthe page contents are loaded how can I do that?
我只想在页面内容加载后才执行 javascript 代码,我该怎么做?
回答by Matt
Use load
instead of ready
:
使用load
代替ready
:
$(document).load(function () {
// code here
});
UpdateYou need to use .on()
since jQuery 1.8. (http://api.jquery.com/on/)
更新您需要.on()
从 jQuery 1.8开始使用。( http://api.jquery.com/on/)
$(window).on('load', function() {
// code here
});
From this answer:
从这个答案:
According to http://blog.jquery.com/2016/06/09/jquery-3-0-final-released/:
Removed deprecated event aliases
.load
,.unload
, and.error
, deprecated since jQuery 1.8, are no more. Use.on()
to register listeners.
根据http://blog.jquery.com/2016/06/09/jquery-3-0-final-released/:
删除了不推荐使用的事件别名
.load
、.unload
、 和.error
,自 jQuery 1.8 起弃用,不再使用。使用.on()
注册听众。
回答by Kshitiz
Following
下列的
$(document).ready(function() {
});
can be replaced
可以更换
$(window).bind("load", function() {
// insert your code here
});
There is once more way which i'm using to increase the page load time.
还有一种方法可以用来增加页面加载时间。
$(document).ready(function() {
$(window).load(function() {
//insert all your ajax callback code here.
//Which will run only after page is fully loaded in background.
});
});
回答by Boyd Cyr
Edit: This code will wait until all content (images and scripts) are fully loaded and rendered in the browser.
编辑:此代码将等待所有内容(图像和脚本)在浏览器中完全加载并呈现。
I've had this problem where $(window).on('load',function(){ ... })
would fire too quick for my code since the JavascriptI used was for formatting purposes and hiding elements. The elements where hidden too soon and where left with a height of 0.
我遇到了这个问题,$(window).on('load',function(){ ... })
因为我使用的Javascript是为了格式化和隐藏元素,所以我的代码触发得太快了。过早隐藏且高度为 0 的元素。
I now use $(window).on('pageshow',function(){ //code here });
and it fires at the time I need.
我现在使用$(window).on('pageshow',function(){ //code here });
它,它会在我需要的时候触发。
回答by Zoltán Süle
nobody mentioned this
没有人提到这个
$(function() {
// place your code
});
which is a shorthand function of
这是一个速记函数
$(document).ready(function() { .. });
回答by ankit suthar
I am looking for the same problem and here is what help me. Here is the jQuery version 3.1.0 and the load event is deprecated for use since jQuery version 1.8. The load event is removed from jQuery 3.0. Instead, you can use on method and bind the JavaScript load event:
我正在寻找同样的问题,这对我有帮助。这是 jQuery 3.1.0 版,从 jQuery 1.8 版起不推荐使用 load 事件。load 事件已从 jQuery 3.0 中删除。相反,您可以使用 on 方法并绑定 JavaScript 加载事件:
$(window).on('load', function () {
alert("Window Loaded");
});
回答by Diego Vinícius
You can avoid get undefined in '$' this way
您可以通过这种方式避免在 '$' 中未定义
window.addEventListener("DOMContentLoaded", function(){
// Your code
});
EDIT:Using 'DOMContentLoaded' is faster than just 'load' because load wait page fully loaded, imgs included... while DomContentLoaded waits just the structure
编辑:使用 'DOMContentLoaded' 比仅使用 'load' 更快,因为加载等待页面完全加载,包括 imgs...而 DomContentLoaded 只等待结构
回答by Guasque?o
And if you want to run a second function after the first one finishes, see this stackoverflow answer.
如果您想在第一个函数完成后运行第二个函数,请参阅此 stackoverflow 答案。
回答by Marc-André Denault
write the code that you want to be executed inside this. When your document is ready, this will be executed.
写你想在这个里面执行的代码。当您的文档准备好时,这将被执行。
$(document).ready(function() {
});