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


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 相关文章推荐
IE与firefox之jquery用法区别
Oct 03 Javascript
jQuery学习笔记之DOM对象和jQuery对象
Dec 22 Javascript
JavaScript中的作用域链和闭包
Jun 30 Javascript
Javascript编写俄罗斯方块思路及实例
Jul 07 Javascript
jquery实现简易的移动端验证表单
Nov 08 Javascript
详解js图片轮播效果实现原理
Dec 17 Javascript
window.onerror()的用法与实例分析
Jan 27 Javascript
javascript实现滚动效果的数字时钟实例
Jul 21 Javascript
JS实现焦点图轮播效果的方法详解
Dec 19 Javascript
JavaScript实现图片本地预览功能【不用上传至服务器】
Sep 20 Javascript
React key值的作用和使用详解
Aug 23 Javascript
微信小程序动态评分展示/五角星展示/半颗星展示/自定义长度展示功能的实现
Jul 22 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面向对象程序设计之接口用法
2014/08/20 PHP
PHP中使用sleep造成mysql读取失败的案例和解决方法
2014/08/21 PHP
php数组去除空值函数分享
2015/02/02 PHP
用javascript获取textarea中的光标位置
2008/05/06 Javascript
跟着JQuery API学Jquery 之二 属性
2010/04/09 Javascript
从零开始学习jQuery (十一) 实战表单验证与自动完成提示插件
2011/02/23 Javascript
jquery异步请求实例代码
2011/06/21 Javascript
JavaScript字符串对象fromCharCode方法入门实例(用于把Unicode值转换为字符串)
2014/10/17 Javascript
JS+CSS实现的拖动分页效果实例
2015/05/11 Javascript
jquery对Json的各种遍历方法总结(必看篇)
2016/09/29 Javascript
简单实现js拖拽效果
2017/07/25 Javascript
Vue在页面数据渲染完成之后的调用方法
2018/09/11 Javascript
JS代码屏蔽F12,右键,粘贴,复制,剪切,选中,操作实例
2019/09/17 Javascript
Vite和Vue CLI的优劣
2021/01/30 Vue.js
树莓派中python获取GY-85九轴模块信息示例
2013/12/05 Python
查看Python安装路径以及安装包路径小技巧
2015/04/28 Python
使用Python来编写HTTP服务器的超级指南
2016/02/18 Python
用python解压分析jar包实例
2020/01/16 Python
如何将PySpark导入Python的放实现(2种)
2020/04/26 Python
Python map及filter函数使用方法解析
2020/08/06 Python
浅谈HTML5 &amp; CSS3的新交互特性
2016/07/19 HTML / CSS
美国鲍勃商店:Bob’s Stores
2018/07/22 全球购物
bonprix荷兰网上商店:便宜的服装、鞋子和家居用品
2020/07/04 全球购物
十一个高级MySql面试题
2014/10/06 面试题
opencv实现图像几何变换
2021/03/24 Python
商超业务员岗位职责
2014/03/12 职场文书
党员公开承诺践诺书
2014/03/25 职场文书
党员批评与自我批评发言稿
2014/10/14 职场文书
统计工作个人总结
2015/03/03 职场文书
九九重阳节致辞
2015/07/31 职场文书
2016年学校安全教育月活动总结
2016/04/06 职场文书
详解如何修改nginx的默认端口
2021/03/31 Servers
Python自动化爬取天眼查数据的实现
2021/06/15 Python
Python MNIST手写体识别详解与试练
2021/11/07 Python
 Redis 串行生成顺序编码的方法实现
2022/04/03 Redis
MySQL主从切换的超详细步骤
2022/06/28 MySQL