为什么$(window).load()在jQuery中不起作用?

gmxoilav  于 2023-03-07  发布在  jQuery
关注(0)|答案(5)|浏览(328)

我正在用visual studio学习jQuery,并在Chrome浏览器中测试我的代码。这是我的HTML代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="jquery-3.1.0.js"></script>

    <script type="text/javascript">
        $(window).load(function () {
            alert("Window Loaded");
        });
    </script>
</head>
<body>

</body>
</html>

这是我的解决方案资源管理器

现在为什么我的浏览器不提醒“窗口加载”?

uqzxnwby

uqzxnwby1#

您使用的是jQuery 3.1.0版,而load事件从jQuery 1.8版起就不再使用了。load事件已从jQuery 3.0中删除,您可以使用on方法并绑定JavaScript load event

$(window).on('load', function () {
      alert("Window Loaded");
 });
j5fpnvbx

j5fpnvbx2#

简言之,第一个答案是正确的:

$(window).on('load', function () {
  alert("Window Loaded.");
});

我必须单独写一个完整的答案,因为很难在第二个答案上加上这么长的评论。
很抱歉这么说,但上面的第二个答案并不正确。
以下三种情况可以说明我的观点:

**方案1:**在以下方法被弃用之前,

$(window).load(function () {
     alert("Window Loaded.");
  });

如果我们执行以下两个查询:

<script>
   $(window).load(function () {
     alert("Window Loaded.");
   }); 
 
   $(document).ready(function() {
     alert("Dom Loaded.");
   });
</script>,

来自第二个查询的警报(Dom Loaded.)将首先显示,来自第一个查询的警报(Window Loaded.)将稍后显示,这是应该的方式。
**场景2:**但是如果我们执行下面两个查询,就像上面第二个答案所建议的那样:

<script>
   $(window).ready(function () {
     alert("Window Loaded.");
   }); 
 
   $(document).ready(function() {
     alert("Dom Loaded.");
   });
</script>,

来自第一个查询的警报(Window Loaded.)将首先显示,来自第二个查询的警报(Dom Loaded.)将稍后显示,这是不正确的。
**场景3:**另一方面,如果我们执行以下两个查询,我们将得到正确的结果:

<script>
   $(window).on("load", function () {
     alert("Window Loaded.");
   }); 
 
   $(document).ready(function() {
     alert("Dom Loaded.");
   });
</script>,

也就是说,来自第二个查询的警报(Dom Loaded.)将首先显示,来自第一个查询的警报(Window Loaded.)将稍后显示,这是正确的结果。
这就是为什么第一个答案是正确的:

$(window).on('load', function () {
  alert("Window Loaded.");
});
yxyvkwin

yxyvkwin3#

<script type="text/javascript">
   $(window).ready(function () {
      alert("Window Loaded");
   });
</script>
zysjyyx4

zysjyyx44#

我使用的是最新版本3.6.1 jQuery,document.ready和window.load未按正确顺序执行;有时document.ready会在window. load之后执行。使用下面的脚本,执行顺序对我来说很好。

//If you want the earliest event use native code (similar to document.ready function)
document.addEventListener("DOMContentLoaded", function () {
    console.log("01. DOMContentLoaded");    
})

//If you want to trigger event after window load (after all assets are loaded)
window.addEventListener('load', function () {
    console.log("02. Window onload event"); 
});
rmbxnbpk

rmbxnbpk5#

在jquery-3.1.1中

$("#id").load(function(){
//code goes here
});

将不工作,因为加载函数不再工作

相关问题