Jquery遮罩ShowLoading组件

时间:2020-08-29 09:06:08
【文件属性】:
文件名称:Jquery遮罩ShowLoading组件
文件大小:155KB
文件格式:RAR
更新时间:2020-08-29 09:06:08
ShowLoading 遮罩用途及效果 ShowLoading这个jQuery插件设计用于当运行Ajax请求时,可以在屏幕某一特殊区域(id,class或者html标签)覆一张正在加载中的图片。 有时候我们页面调用后台程序时间比较长时,前台页面暴露在用户之下,如果用户点击可能会造成逻辑混乱。这时候,遮罩就起到了很好的效果,在触发后台程序时我们将前台页面遮住,不让操作,同时给予一个程序运行请等待的效果。 遮罩效果: 二、JQuery遮罩UI实现 三、使用方法 假设html页面有有一个class为add_test_img的标签,需要通过ajax访问后台,并在add_test_img标签中显示一些相关内容,在内容显示之前,可对add_test_img标签使用遮罩,防止在数据显示之前,被修改其中的内容 复制代码 //显示遮罩 $(".add_test_img").showLoading(); //ajax调用 $.ajax({ type: "GET", url: "Api.php", data: {ApiTarget: 'TestImage', op: 'paginateByClassId', prj_id: prj_id, class_id:class_id, page: index, per_page: items_per_page, user_id: user_id, start_date:start_date_str, end_date:end_date_str}, success: function(response){ //对返回数据进行处理,并显示 //...... //去除遮罩 $(".add_test_img").hideLoading(); }, error: function(xhr) { //显示失败信息 //...... //去除遮罩 $(".add_test_img").hideLoading(); } });
【文件预览】:
jqLoad
----HtmlPage.html(1KB)
----Scripts()
--------jquery-1.4.1.min.js(70KB)
--------jquery-ui-jqLoding.js(5KB)
--------jquery-1.4.1-vsdoc.js(234KB)
--------jquery-1.8.0.min.js(90KB)
--------jquery-1.4.1.js(165KB)
----image()
--------loading.gif(2KB)

网友评论

  • 楼主自己开发的,遮罩层不是官方的js