我试图在此下载脚本中包含两个函数,但我无法使其工作
1-在下载结束时(动画下载栏),在示例浏览器中自动开始下载:window.open ()
。
但这包括脚本中的默认名称。
2-当检测到死链接或大小为0字节时,如果可能,request.open ()
会发出警告。
任何帮助都非常有用,问候。
var _OBJECT_URL;
document.querySelector('#download-button').addEventListener('click', function() {
var request = new XMLHttpRequest();
request.addEventListener('readystatechange', function(e) {
if(request.readyState == 2 && request.status == 200) {
document.querySelector('#start-download').style.display = 'block';
document.querySelector('#download-button').style.display = 'none';
}
else if(request.readyState == 3) {
document.querySelector('#download-progress-container').style.display = 'block';
document.querySelector('#start-download').style.display = 'none';
}
else if(request.readyState == 4) {
_OBJECT_URL = URL.createObjectURL(request.response);
document.querySelector('#save-file').setAttribute('href', _OBJECT_URL);
// NAME default
document.querySelector('#save-file').setAttribute('download', 'MyNameFile.zp');
// OPEN FILE IN BROWSER
//Open file, start download automatically sample: window.open(_OBJECT_URL)
// and that includes the default name "MyFilename.zip"
document.querySelector('#save-file').style.display = 'block';
document.querySelector('#download-progress-container').style.display = 'none';
setTimeout(function() {
window.URL.revokeObjectURL(_OBJECT_URL);
document.querySelector('#download-button').style.display = 'block';
document.querySelector('#save-file').style.display = 'none';
}, 60*1000);
}
});
request.addEventListener('progress', function(e) {
var percent_complete = (e.loaded / e.total)*100;
document.querySelector('#download-progress').style.width = percent_complete + '%';
});
request.responseType = 'blob';
request.open('get', 'https://www.google.com.sv/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png');
request.send();
// HERE NOTICE DEAD LINK
//If the link is dead, notify with some notice
});

body {
margin: 0;
font-family: "Titillium Web";
font-size: 15px;
}
#demo-container {
width: 400px;
margin: 60px auto;
}
#download-button {
background-color: white;
color: #2980b9;
border: 2px solid #2980b9;
font-family: inherit;
outline: none;
min-width: 100px;
padding: 10px;
font-size: inherit;
border-radius: 2px;
cursor: pointer;
display: block;
margin: 0 auto;
}
#start-download {
text-align: center;
display: none;
}
#download-progress-container {
border: 1px solid #cccccc;
padding: 4px;
display: none;
height: 20px;
}
#download-progress {
background-color: #2980b9;
display: inline-block;
height: 100%;
}
#save-file {
color: #2980b9;
text-decoration: none;
display: none;
text-align: center;
}
#save-file:hover {
text-decoration: underline;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<body>
<div id="demo-container">
<button id="download-button">Download</button>
<div id="download-ui-container">
<div id="start-download">Starting Download..</div>
<div id="download-progress-container"><div id="download-progress"></div></div>
<a id="save-file">Save File</a>
</div>
</div>
&#13;