Home Web Front-end JS Tutorial How to prevent users from performing other operations on the web page while the web page is downloading files_jquery

How to prevent users from performing other operations on the web page while the web page is downloading files_jquery

May 16, 2016 pm 04:43 PM
download file

When downloading files from web pages, sometimes the files are too large and it takes a while to generate the files. At this time, to prevent users from performing other operations on the web page, one method is to use a div to cover the web page and lock the web page.

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); 
}
Copy after login

Use the above function to lock the page to prevent multiple operations until the download box appears to cancel the lock screen.

Set cookies in server side (cgi):

<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");
Copy after login

Import the plug-in jquery.cookie.js on the client side (html, js), include this plug-in in the html file, and obtain cookies regularly in the js file

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 
} 
Copy after login

That’s it.

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Repo: How To Revive Teammates
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: How To Get Giant Seeds
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Where are the files downloaded by vivo browser? Where are the files downloaded by vivo browser? Feb 23, 2024 pm 08:55 PM

Where are the files downloaded by the vivo browser? The files downloaded by the vivo browser will be stored in a dedicated location, but most friends do not know where the files downloaded by the vivo browser are. Next, the editor will bring it to users Graphic tutorial on how to open files downloaded from vivo browser, interested users come and take a look! Vivo mobile phone usage tutorial Where are the files downloaded by vivo browser? 1. First open the browser APP, then enter the bottom of the browser main interface and click [Menu]; 2. Then expand the function bar below and click the [Download Record] option; 3 , then in the download record interface, select [Download Complete]; 4. Select the location where you want to view the downloaded file, and click the [Open] button at the back; 5

How to download files from Thunder ed2k? Thunder ed2k usage tutorial How to download files from Thunder ed2k? Thunder ed2k usage tutorial Mar 14, 2024 am 10:50 AM

How to download files from Thunder ed2k? As a common shared file, many users will encounter situations where downloading is not supported when downloading ed2k. So how do you download it through Thunder? Let this site introduce to users the tutorial on how to use Thunder ed2k. Thunder ed2k usage tutorial 1. Copy the ed2k link. 2. Open "Thunder" and click "+" in the upper left corner. 3. Copy the link and click "Download Now".

Where are the files downloaded from Apple QQ? Where are the files downloaded from Apple QQ? Mar 08, 2024 pm 02:50 PM

QQ is a popular instant messaging software, and almost everyone has a QQ number. When using an Apple phone, you may encounter difficulties in storing and retrieving files. Generally, these files are stored in the Documents folder in the corresponding application directory. Where are the files downloaded from QQ on iPhone? 1. First open the QQ application on iPhone and click on the personal avatar to enter the personal page. 2. In the menu at the bottom of the personal page, select [My Files] and click Open. 3. Then enter [Local Files] to view the files saved by QQ on the mobile phone. 4. In the local file, click the View button to view the downloaded file information.

Where are the downloaded files from Little Red Car Creative Workshop? Where are the downloaded files from Little Red Car Creative Workshop? Mar 20, 2024 am 09:47 AM

Users can use Xiaohongche Creative Workshop to download various wallpapers. Many users do not know where the files downloaded by Xiaohongche Creative Workshop are. Users can find a folder with a number under content. The downloaded files are all here. . Where are the files downloaded from Little Red Car Creative Workshop? Answer: It is in the local folder-steamapps-workshop-content. 1. Open steam and find WallpaperEngine: wallpaper engine. 2. Right-click Manage, and then click Browse local files. 3. Open the folder and click steamapps. 4. Click workshop. 5. Click content. 6. Find the folder with the number. 7. All downloaded wallpapers are there

How to set a save disk for downloaded files in Windows 11 How to set a save disk for downloaded files in Windows 11 Apr 20, 2024 pm 06:32 PM

For users who are new to the Windows 11 system, usually the file download path will follow the system default settings, and the files are often saved in the system disk. In the long run, it may affect the overall performance of the computer by occupying too much system disk space. In order to manage and allocate storage space more rationally, it is important to learn how to customize the save disk for downloaded files in Windows 11 system. This article will explain in detail how to flexibly set the target disk for downloaded files in Windows 11 to meet users' personalized storage needs. If this is what you need, you may wish to continue reading and we will introduce you to the steps of this practical function in detail. Operation method 1. Double-click to open "This PC" on the desktop. 2. Then find the new interface in the left column

Download file via AJAX call in PHP Download file via AJAX call in PHP Sep 05, 2023 am 11:33 AM

Using Ajax to download files is considered a bad idea. Instead, use window.location= or document.location. 'window.location' has the following characteristics - Requires JavaScript to be enabled No PHP required. It helps to display the content website and redirect the user after few seconds. Redirects can depend on any condition, for example - $success=1if($success){ window.location.href='http://example.com';} named

How to solve the problem of Firefox browser failing to download files How to solve the problem of Firefox browser failing to download files Jan 29, 2024 pm 08:12 PM

What should I do if Firefox fails to download files? Have you ever encountered a file download failure when using Firefox to download files? There are many reasons for this problem. Improper system settings, incorrect file content, virus reports on download links, etc. may cause this problem. However, most of the time it is improper system settings that cause the download to fail. So how do you restore it? What's normal? Below, the editor will bring you the solution to the failure of Firefox browser to download files. Solution to Firefox browser failure to download files 1. Open Firefox browser on your computer and enter the homepage, 2. Click the arrow position to enter the drop-down menu and click Options, 3. On the left side of the options page, we find the menu, 4 .Click Privacy & Security, 5.

How to check the address of downloaded files on DingTalk_Introduction to checking the address of downloaded files on DingTalk How to check the address of downloaded files on DingTalk_Introduction to checking the address of downloaded files on DingTalk Mar 29, 2024 pm 07:16 PM

1. Open DingTalk and click on File Assistant. 2. Click a file to enter. 3. Click Download in the lower left corner. 4. You can see the detailed location of file storage. 5. Open the file management and search for DingTalk in the phone storage to see the downloaded file.

See all articles