比较常见的做法，但对我而言是第一次做，记录一下。
为了把找来的loading.gif 的背景色设置为透明，还特意装了quicktime。
有学到一些额外的东西。
先将div及img定义好
<body>
<div id="loadingDiv">
<img src="loading.gif" style="margin-top:230px;margin-left:700px;" />
</div>
</body>
注意：在img内可以用margin-top 和 margin-left 将loading的图片调整到列表正中央。
css样式(重点)
#loadingDiv {
background-color:grey;
filter: alpha(opacity=50); <!--IE的透明度-->
opacity: 0.1;<!--透明度，数值越大越透明，不要调太小，不然gif图片会特别模糊-->
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
z-index: 100; <!--此处的图层要大于页面-->
display:none;
}
注意：此处用的id样式，页面初始化即启用，且已在样式内将该div设置为不显示。
之后将在js内动态调整它的隐藏与显示属性。当它显示时，将会遮盖住整个body，
用户无法对页面进行任何操作。
javascript代码：
function loadData(){
//弹出遮盖层
$("#loadingDiv").fadeTo(200,0.5);
$.ajax({
url: 'xx/xx!query.action',
dataType:"json",
type: 'POST',
success: function(data) {
//此处是加载列表数据的代码
//数据加载完毕，则关闭遮盖层
$("#loadingDiv").fadeOut(200);
}
});
}
注意：这里用了fadeTo和fadeOut来显示和隐藏div，当然也可以用 show 和 hide。
相关推荐
在我们的在线答题页面中，jQuery将发挥关键作用，帮助我们快速构建用户界面和交互功能。 二、页面结构与样式 1. HTML布局：页面通常分为两部分，左侧显示题目，右侧为答题卡。HTML结构应包含一个用于显示题目的...
在标题"弹出一个层(禁止刷新父页或允许刷新)5种实现方法"中，我们将探讨五种不同的JavaScript技术来创建这种效果，同时考虑是否在弹出层打开后锁定父页面，以及是否允许用户通过刷新页面来关闭弹出层。 1. **纯CSS...
1.19 获取鼠标在窗口页面中的坐标 1.20 设置Flash对象的WMode窗口模式 1.21 实现类Twitter的字数限制效果 1.22 提示文本的隐藏与显示 1.23 实现文字闪烁效果 1.24 实现文字动画效果 1.25 实现文字跟随鼠标移动变化的...
jQuery Mobile 的一大特点就是使用AJAX技术进行页面间的平滑过渡，通过`data-ajax="false"`禁止AJAX加载，对于需要重新加载整个页面的情况，如登录成功跳转到主页面。 五、注册与登录逻辑 1. 后端接口：后端需提供...
5. **处理数据加载**：在`onPullDown`回调函数中，通常会发起一个Ajax请求获取新的数据，然后将这些数据插入到页面中适当的位置。记得在数据加载完成后调用`myScroll.refresh()`来更新iScroll的状态，以便用户看到新...
为了提高性能，可以使用数据属性（如`data-dom-cache="true"`）缓存页面，减少DOM操作，以及使用`$.mobile.ignoreContentEnabled = true;`防止自动增强某些元素。 掌握这些jQuery Mobile的常用技巧，将有助于提升...
使用jQuery的`$.ajax()`或`$.post()`方法，设置`url`为服务器端处理文件的接口，`type`为`POST`，`contentType`设为`false`以避免自动设置Content-Type，`processData`设为`false`禁止jQuery处理数据，然后将...
1. 引入jQuery库和插件文件：在HTML文件中添加相应的JavaScript和CSS链接。 2. 初始化插件：通过JavaScript代码初始化日期选择器，指定相应的元素和配置选项。 3. 处理事件：绑定选择日期后的回调函数，进行数据处理...
5. **异步加载**：对于大型数据集，zTree支持分页和懒加载，只有在需要时才从服务器获取数据，提高页面性能。 6. **多选模式**：zTree允许用户选择多个节点，可以设置单选或多选模式，并获取用户的选择结果。 7. *...
3. **初始化插件**：在文档加载完成后，通过jQuery选择器找到需要添加标签功能的元素，并调用`.tagator()`方法进行初始化，可传递配置选项以定制行为。 4. **配置选项**：根据需求调整各种配置项，如是否开启自动...
在jQuery中，"一个框里有内容时，屏蔽其他框"这个需求通常涉及到焦点管理、事件监听以及元素的可见性控制。以下是对这个主题的详细解释： 首先，我们需要理解"框"在这里通常指的是HTML中的输入框，如`<input>`或`...
在本文中，我们将深入探讨如何使用jQuery来创建一个功能丰富的文本框，该文本框能够动态地生成和管理关键词标签。这个功能广泛应用于各种网站，如社交媒体、博客平台、论坛等，帮助用户方便地组织和分类内容。 首先...
在网页开发中，jQuery是一个非常流行的JavaScript库，它极大地简化了DOM操作、事件处理和动画效果。本篇文章将深入探讨如何使用jQuery实现表格无刷新排序，这是一个提高用户体验的有效方法，尤其是在处理大量数据时...
在Web开发中，jQuery Combobox是一款常用的UI组件，它将下拉列表和文本输入框结合在一起，提供了更友好的用户交互体验。然而，实际应用中可能会遇到一些问题，如默认选择不正确、在滚动操作后无法关闭下拉列表等。...
RatingStars插件是基于jQuery构建的，因此在使用之前需要确保页面已经引入了jQuery库。 ### RatingStars主要特性 1. **自定义星星图案**：RatingStars插件允许开发者替换默认的星星图标，可以使用SVG、PNG或任何...
// the options for this ajax request }cache(true) 数据类型: Boolean jQuery 1.2中新添加的参数, 如果设为false，则会强制浏览器不缓存请求的页面。 complete 数据类型: Function 当请求完成时...
1. **引入jQuery**：首先确保你的页面已经包含了jQuery库，这通常是通过在`<head>`标签内添加链接到jQuery的CDN来完成的。 2. **引入tablesorter**：然后，你需要引入tablesorter的JavaScript文件，通常通过`...
在JavaScript的世界里，由于同源策略的限制，浏览器禁止了不同源之间进行AJAX通信，但JSONP（JSON with Padding）作为一种巧妙的方式，允许我们绕过这个限制，实现在jQuery中进行跨域请求。本篇文章将深入探讨JSONP...
在.NET和jQuery的世界里，无刷新多文件上传是一种提高用户体验的技术，它允许用户在不重新加载整个网页的情况下上传多个文件。这种技术的核心在于利用Ajax异步通信和前端库（如jQuery）来处理用户交互，同时借助后端...