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


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做flash做的事..才完成的一个类.Auntion Action var 0.1
Feb 23 Javascript
jquery 滚动条事件简单实例
Jul 12 Javascript
jquery.validate使用详解
Jun 02 Javascript
js简单判断flash是否加载完成的方法
Jun 21 Javascript
谈谈JavaScript中的几种借用方法
Aug 09 Javascript
JS快速实现移动端拼图游戏
Sep 05 Javascript
js事件源window.event.srcElement兼容性写法(详解)
Nov 25 Javascript
js实现适配移动端的拖动效果
Jan 13 Javascript
js实现小星星游戏
Mar 23 Javascript
Vue实现图片轮播组件思路及实例解析
May 11 Javascript
vue 子组件和父组件传值的示例
Sep 11 Javascript
基于Vue.js+Nuxt开发自定义弹出层组件
Oct 09 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 MVC框架skymvc支持多文件上传
2016/05/26 PHP
PHP 类与构造函数解析
2017/02/06 PHP
基于ThinkPHP实现的日历功能实例详解
2017/04/15 PHP
Laravel如何使用Redis共享Session
2018/02/23 PHP
PHP基于phpqrcode类生成二维码的方法示例详解
2020/08/07 PHP
jquery 分页控件实现代码
2009/11/30 Javascript
Javascript的构造函数和constructor属性
2010/01/09 Javascript
用jQuery扩展自写的 UI导航
2010/01/13 Javascript
基于Jquery的回车成tab焦点切换效果代码(Enter To Tab )
2010/11/14 Javascript
javascript之Partial Application学习
2013/01/10 Javascript
Node.js中创建和管理外部进程详解
2014/08/16 Javascript
JS和css实现检测移动设备方向的变化并判断横竖屏幕
2015/05/25 Javascript
JS模仿编辑器实时改变文本框宽度和高度大小的方法
2015/08/17 Javascript
JS尾递归的实现方法及代码优化技巧
2019/01/19 Javascript
微信小程序实现的图片保存功能示例
2019/04/24 Javascript
[01:05]主宰至宝剑心之遗
2017/03/16 DOTA
python 不关闭控制台的实现方法
2011/10/23 Python
python算法学习之桶排序算法实例(分块排序)
2013/12/18 Python
Python网络编程之TCP套接字简单用法示例
2018/04/09 Python
python Flask 装饰器顺序问题解决
2018/08/08 Python
pygame游戏之旅 调用按钮实现游戏开始功能
2018/11/21 Python
python sqlite的Row对象操作示例
2019/09/11 Python
pytorch 实现在预训练模型的 input上增减通道
2020/01/06 Python
Python3 利用face_recognition实现人脸识别的方法
2020/03/13 Python
css3 按钮样式简单可扩展创建
2013/03/18 HTML / CSS
美国第一香水网站:Perfume.com
2017/01/23 全球购物
Get The Label中文官网:英国运动时尚购物平台
2017/04/19 全球购物
Lacoste澳大利亚官网:服装、鞋类及配饰
2018/11/14 全球购物
俄罗斯一家时尚女装商店:Charuel
2019/12/04 全球购物
2014年学生资助工作总结
2014/12/18 职场文书
小学四年级学生评语
2014/12/26 职场文书
客户答谢会致辞
2015/01/20 职场文书
就业推荐表院系意见
2015/06/05 职场文书
教师理论学习心得体会
2016/01/21 职场文书
2016学习医德医风心得体会
2016/01/25 职场文书
「月刊Action」2022年5月号封面公开
2022/03/21 日漫