网页下载文件期间如何防止用户对网页进行其他操作


Posted in Javascript onJune 27, 2014

做网页下载文件时,有时候文件过大,生成文件需要一段时间。这个时候要防止用户对网页进行其他操作,有种方法就是使用一个div覆盖在网页上,将网页锁住。

function lockScreen() 
{ 
sWidth=$(window).width(); 
sHeight=$(window).height(); 
var bgObj=document.createElement("div"); 
bgObj.setAttribute('id','bgDiv'); 
bgObj.style.position="absolute"; 
bgObj.style.top="0"; 
bgObj.style.background="#CCCCCC"; 
bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75"; 
bgObj.style.opacity="0.6"; 
bgObj.style.left="0"; 
bgObj.style.width=sWidth + "px"; 
bgObj.style.height=sHeight + "px"; 
if(sWidth < 860) 
{ 
bgObj.style.width="860px"; 
} 
bgObj.style.zIndex = "10000"; 
document.body.appendChild(bgObj); 
}

使用如上函数可以锁住页面防止多次操作,要直到下载框出现时取消锁屏。

在服务器端(cgi)中设置cookie:

<pre name="code" class="cpp">char *configDownloadToken = "finishedDownloadFile"; 
printf("Content-Type: application/octet-stream\nContent-Length: %ld\n", s.st_size); 
printf( "Set-Cookie:configDownloadToken=%s; path=/; \r\n ",configDownloadToken); 
printf("Content-Disposition: attachment; filename=\"%s\"\n", strrchr(filename,'/') + 1); 
printf("Connection: close\n\n");

在客户端(html、js)导入插件jquery.cookie.js,在html文件中要包含此插件,js文件中定时获取cookie

var configDownloadCheckTimer; 
$(document).ready(function () { 
configDownloadCheckTimer = window.setInterval(function() { 
var cookieValue = $.cookie('configDownloadToken'); 
if (cookieValue === "finishedDownloadFile") 
{ 
refreshPage(); 
finishDownload(); 
} 
}, 1000); 
}); 

function finishDownload() { 
window.clearInterval(configDownloadCheckTimer); 
$.removeCookie('configDownloadToken'); //clears this cookie value 
}

这样就可以了。

Javascript 相关文章推荐
JavaScript数组和循环详解
Apr 27 Javascript
基于jQuery实现简单的折叠菜单效果
Nov 23 Javascript
利用BootStrap的Carousel.js实现轮播图动画效果
Dec 21 Javascript
vue v-on监听事件详解
May 17 Javascript
JavaScript全屏和退出全屏事件总结(附代码)
Aug 17 Javascript
JavaScript实现QQ列表展开收缩扩展功能
Oct 30 Javascript
Angular Renderer (渲染器)的具体使用
May 03 Javascript
JQuery事件委托原理与用法实例分析
May 13 jQuery
使用watch在微信小程序中实现全局状态共享
Jun 03 Javascript
vue选项卡切换登录方式小案例
Sep 27 Javascript
springboot+vue+对接支付宝接口+二维码扫描支付功能(沙箱环境)
Oct 15 Javascript
利用JavaScript模拟京东按键输入功能
Dec 01 Javascript
jQuery+ajax实现鼠标单击修改内容的方法
Jun 27 #Javascript
node.js实现逐行读取文件内容的代码
Jun 27 #Javascript
javascript实现的HashMap类代码
Jun 27 #Javascript
js图片滚动效果时间可随意设定当鼠标移上去时停止
Jun 26 #Javascript
Javascript字符串对象的常用方法简明版
Jun 26 #Javascript
fixedBox固定div漂浮代码支持ie6以上大部分主流浏览器
Jun 26 #Javascript
js实现回放拖拽轨迹从过程上进行分析
Jun 26 #Javascript
You might like
PHP新手用的Insert和Update语句构造类
2012/03/31 PHP
PHP实现全角字符转为半角方法汇总
2015/07/09 PHP
Javascript isArray 数组类型检测函数
2009/10/08 Javascript
JS 类型转换常见方法小结
2010/05/31 Javascript
基于jQuery的图片大小自动适应实现代码
2010/11/17 Javascript
jQuery语法总结和注意事项小结
2012/11/11 Javascript
jQuery中实现动画效果的基本操作介绍
2013/04/16 Javascript
Jquery创建层显示标题和内容且随鼠标移动而移动
2014/01/26 Javascript
3个可以改善用户体验的AngularJS指令介绍
2015/06/18 Javascript
webpack中引用jquery的简单实现
2016/06/08 Javascript
javascript实现图片左右滚动效果【可自动滚动,有左右按钮】
2016/09/19 Javascript
利用jquery实现下拉框的禁用与启用
2016/12/07 Javascript
vue+vuex+axio从后台获取数据存入vuex实现组件之间共享数据
2017/04/22 Javascript
SpringMVC+bootstrap table实例详解
2017/06/02 Javascript
w3c编程挑战_初级脚本算法实战篇
2017/06/23 Javascript
jsTree事件和交互以及插件plugins详解
2017/08/29 Javascript
微信小程序分享功能之按钮button 边框隐藏和点击隐藏
2018/06/14 Javascript
vue addRoutes路由动态加载操作
2020/08/04 Javascript
[00:12]DAC2018 天才少年转战三号位,他的SOLO是否仍如昔日般强大?
2018/04/06 DOTA
[02:50]【扭转乾坤,只此一招】DOTA2全新版本永雾林渊开启新篇章
2020/12/24 DOTA
Python中用altzone()方法处理时区的教程
2015/05/22 Python
实现Python与STM32通信方式
2019/12/18 Python
Python GUI编程学习笔记之tkinter事件绑定操作详解
2020/03/30 Python
HTML高亮关键字的实现代码
2018/10/22 HTML / CSS
Bluebella美国官网:英国性感内衣品牌
2018/10/04 全球购物
.NET remoting的两种通道是什么
2016/05/31 面试题
煤矿班组长的职责
2013/12/25 职场文书
电脑销售顾问自荐信
2014/01/29 职场文书
校园演讲稿汇总
2014/05/21 职场文书
纪念九一八爱国演讲稿600字
2014/09/14 职场文书
机动车登记业务委托书
2014/10/08 职场文书
2014超市收银员工作总结
2014/11/13 职场文书
如何书写授权委托书?
2019/06/25 职场文书
创业计划书之个人工作室
2019/08/22 职场文书
简单聊聊Golang中defer预计算参数
2022/03/25 Golang
html中相对位置与绝对位置的具体使用
2022/05/15 HTML / CSS