在网页开发中，用户体验是至关重要的，而页面加载效果正是提升用户体验的一种手段。本文将详细介绍如何使用jQuery来实现页面加载的动画效果，特别是在数据异步请求时显示“请稍后，正在加载...”的提示。
jQuery是一个流行的JavaScript库，它简化了DOM操作、事件处理、Ajax交互等任务。在jQuery中实现页面加载效果，主要涉及到的是DOM操作和动画效果的创建。
1. **页面结构与样式**：
在示例代码中，定义了一些CSS类，如`.loading`、`.action`、`.cover`和`.showLoad`，用于控制加载效果的样式。`.loading`是装载提示的容器，`.action`是触发加载的按钮，`.cover`是一个全屏覆盖层，用来遮盖整个页面，`.showLoad`则是显示加载中的动画元素。这些样式使得加载提示具有良好的视觉效果。
2. **JavaScript部分**：
引入jQuery库后，通过$(function () {})包裹的代码确保在DOM加载完成后执行。`$(".cover").css({"height": hei})`用来设置覆盖层的高度等于文档高度，确保全屏覆盖。
`$(".action").click(function () {})`监听`.action`按钮的点击事件，当用户点击该按钮时，会触发加载效果。`startWaiting()`和`endWaiting()`是两个关键函数，分别表示开始加载和结束加载的处理。
`startWaiting()`函数中，`.cover`的`display`属性被设置为`block`并逐渐变为半透明，`.showLoad`通过`stop(true)`停止当前动画并跳到最新位置，然后通过`animate()`方法自上而下平滑移动至屏幕中央，同时逐渐变得可见。
`endWaiting()`函数用于结束加载效果，`.showLoad`会反向执行动画，回到初始位置并逐渐变为不可见，`.cover`的`display`属性也恢复为`none`，恢复页面正常状态。
3. **异步请求与加载效果**：
标签中提到的“jquery 加载”通常指的是jQuery的Ajax功能。在实际应用中，当使用$.ajax()或$.get()、$.post()等方法进行异步请求时，可以结合上述加载效果，在发送请求前调用`startWaiting()`，在请求完成（无论成功或失败）后调用`endWaiting()`，以提供加载状态的可视化反馈。
通过jQuery实现的页面加载效果，可以显著提升用户在等待数据加载过程中的体验，使用户更加了解当前页面的状态，减少用户的焦虑感。结合异步请求，这种加载效果尤其适用于大数据量或长时间运算的场景。开发者可以根据自己的需求调整样式和动画参数，创造出符合自己项目风格的加载效果。
