$(window).load()事件用法

`$(window).load()`事件是在所有页面资源都已经加载完成后触发的事件，与`window.onload`事件类似。它是jQuery库提供的一个事件，可以用来执行一些需要等待所有资源加载完成后才能进行的操作。

`$(window).load()`事件的用法如下：

$(window).load(function() {
  // 所有页面资源都已经加载完成后执行的代码
});

在这个事件中，可以进行一些需要等待所有资源加载完成后才能进行的操作，例如操作图片、计算元素的位置、执行动画效果等等。

需要注意的是，`$(window).load()`事件触发的时间比`$(document).ready()`事件（或者说DOMContentLoaded事件）要晚，因为它需要等待所有资源加载完成后才能触发。因此，如果只需要操作DOM元素，就可以使用`$(document).ready()`事件或者DOMContentLoaded事件，如果需要操作图片等资源，可以使用`$(window).load()`事件。

另外，从jQuery 3.0版本开始，`$(window).load()`事件已经被废弃，建议使用`$(window).on('load', function(){})`来代替。

相关问题

window.load事件触发后如何通过js再次触发load事件

在JavaScript中，可以使用Window对象的location.reload()方法来重新加载页面并触发load事件。

示例代码如下所示：

window.addEventListener('load', function() {
  // 在load事件触发后执行的代码
  var reloadButton = document.getElementById('reload-button');
  reloadButton.addEventListener('click', function() {
    // 点击按钮后重新加载页面并触发load事件
    window.location.reload();
  });
});

在这个示例代码中，当页面加载完成后，会绑定一个click事件到id为"reload-button"的按钮上。当该按钮被点击时，会调用location.reload()方法来重新加载页面并触发load事件。需要注意的是，重新加载页面会丢失当前页面的所有状态和数据，因此需要谨慎使用。

分析代码： methods: { load() { // this.count += 5; this.$store.commit('increaseCount'); }, toPage(item) { this.$router.push('/PC/detail/' + item.sku); }, // 滑动滚动条 - 实现自动加载 scrollTo() { // 滚动视口高度(也就是当前元素的真实高度) let scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight; // 可见区域高度 let clientHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; // 滚动条顶部到浏览器顶部高度 let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; // console.log (clientHeight); // console.log (scrollTop); // console.log (scrollHeight); if (clientHeight + scrollTop + 1 >= scrollHeight) { // 如果数据量超过30就停止继续加载 console.log('滚动条触底了'); console.log(this.$store.getters.getStoreCount); console.log(this.$store.getters.getStoreCount >= 30); if (this.$store.getters.getStoreCount >= 30) { window.removeEventListener('scroll', scrollTo); console.log('-------------------'); console.log('执行了移除加载事件'); } else { // 一秒后执行 const loading = this.$loading({ lock: true, text: 'Loading', }); setTimeout(() => { this.load(); loading.close(); }, 1000); } } }, },

这是一个 Vue.js 组件中的方法集合。具体来说：

1. `load` 方法通过调用 Vuex 的 mutation `increaseCount` 来增加计数器的值。

2. `toPage` 方法使用 Vue Router 跳转到指定的路由。

3. `scrollTo` 方法实现了自动加载，当用户滑动滚动条时，如果滚动到页面底部，就会触发加载事件。这个方法首先获取滚动视口高度、可见区域高度和滚动条顶部到浏览器顶部高度，然后判断是否已经滚动到了页面底部。如果是，就检查数据量是否已经超过了 30 条。如果已经超过了，就移除滚动事件监听器；否则，就显示加载提示，并在 1 秒后执行 `load` 方法来加载更多数据，然后关闭加载提示。