如何使用javascript制作动态变化的下载链接？
Posted
技术标签:
【中文标题】如何使用javascript制作动态变化的下载链接？【英文标题】：How to make a dynamically changing download link with javascript? 【发布时间】：2016-07-26 04:48:15 【问题描述】：我正在制作一个 Flash 画廊网站，我希望页面底部的文字成为 Flash 的下载链接。此文本更改为当前正在显示的当前 Flash 的标题。我希望 href 标记动态更改以匹配正在播放的特定闪存的文件路径，以便用户可以下载它。这是我第一次玩弄下载链接，更不用说那些随变量动态变化的链接了。所以简而言之，我希望链接更改为链接数组中存在的文件路径。
包含我的动态链接起始代码的函数称为 DOWNLOAD
<body>
<div id="titleText">
<h1>Anon Curb</h1>
</div>
<div id="flashmovie">
<object type="application/x-shockwave-flash" data="swfs/welcomeflash.swf">'+
<param name="movie" value="swfs/welcomeflash.swf">
</object>
</div>
<!-- end #container -->
<div id="buttonCon">
<div id="buttons">
<button id="next">next</button>
<button id="rand">Random</button>
<button id="back">Back</button>
</div>
</div>
<div id="titleCon">
<a href="#" id="downLink">
<div id="title">Hit random button</div>
</a>
</div>
<!-- end #wrapper -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.min.js"></script>
<script src="js/flashcollection.js"></script>
</body>
$(document).ready(function ()
var links = [
'swfs/#1%20(Special%20Japanese%20Extended%20Dance%20Mix).swf',
'swfs/$D6.swf',
'swfs/(MAD)%20Huh.swf'
];
var displaytext = [
'#1 (Special Japanese Extended Dance Mix)',
'$D6',
'(MAD) Huh'
];
var c = 0
var flashmovie, test, temp;
function init()
flashmovie = document.getElementById('flashmovie');
document.getElementById('back').onclick = function ()
if (c == 0)
c = links.length;
c--
displayFiles();
document.getElementById('next').onclick = function ()
if (c == links.length - 1)
c = -1;
c++;
displayFiles();
document.getElementById('rand').onclick = function ()
temp = c;
while (c == temp)
c = Math.floor(Math.random() * links.length);
displayFiles();
function displayFiles()
test = links[c].substring(links[c].lastIndexOf('.') + 1, links[c].length);
document.getElementById('title').innerHTML = displaytext[c];
flashmovie.innerHTML =
'<object type="application/x-shockwave-flash" data="' + links[c] + '">' +
'<param name="movie" value="' + links[c] + '">' +
'<\/object>';
function download()
document.getElementById('rand', 'back', 'next').onclick = function ()
document.getElementById('downlink').attr("href", links[c]);
window.addEventListener ?
window.addEventListener('load', init, false) :
window.attachEvent('onload', init);
);
【问题讨论】：
【参考方案1】：正确的javascript
这使用了 Soltani Neji 的编辑下载功能以及更改下载属性的标签，没有它就无法工作。不知道这对我来说是正常还是特殊
var c = 0;
var flashmovie, test, temp;
function init()
flashmovie = document.getElementById('flashmovie');
document.getElementById('back').onclick = function ()
if (c == 0)
c = links.length;
c--
displayFiles();
download();
document.getElementById('next').onclick = function ()
if (c == links.length - 1)
c = -1;
c++;
displayFiles();
download();
document.getElementById('rand').onclick = function ()
temp = c;
while (c == temp)
c = Math.floor(Math.random() * links.length);
displayFiles();
download();
function displayFiles()
test = links[c].substring(links[c].lastIndexOf('.') + 1, links[c].length);
document.getElementById('title').innerHTML = displaytext[c];
flashmovie.innerHTML =
'<object type="application/x-shockwave-flash" data="' + links[c] + '">' +
'<param name="movie" value="' + links[c] + '">' +
'<\/object>';
function download()
document.getElementById('downLink').setAttribute('href', links[c]);
document.getElementById('downLink').setAttribute('download', displaytext[c]);
window.addEventListener ?
window.addEventListener('load', init, false) :
window.attachEvent('onload', init);
);
【讨论】：
【参考方案2】：您好，我解决了这个问题，这对我有用 对于 HTML 文件，您只需要添加第一张图片的 href，因为文件总是在启动时加载第一张图片，并且您还需要将属性下载添加到标签，所以这就像
<div id="titleCon">
<a href="unknittingmouse1.swf" id="downLink" download="">
<div id="title">Hit random button</div>
</a>
</div>
对于javascript，您需要像这样编辑下载功能 然后在每个按钮单击事件中调用它，如下所示：
$(document).ready(function ()
var links = [
'swfs/#1%20(Special%20Japanese%20Extended%20Dance%20Mix).swf',
'swfs/$D6.swf',
'swfs/(MAD)%20Huh.swf'
];
var displaytext = [
'#1 (Special Japanese Extended Dance Mix)',
'$D6',
'(MAD) Huh'
];
var c = 0
var flashmovie, test, temp;
function init()
flashmovie = document.getElementById('flashmovie');
document.getElementById('back').onclick = function ()
if (c == 0)
c = links.length;
c--
displayFiles();
download();
document.getElementById('next').onclick = function ()
if (c == links.length - 1)
c = -1;
c++;
displayFiles();
download();
document.getElementById('rand').onclick = function ()
temp = c;
while (c == temp)
c = Math.floor(Math.random() * links.length);
displayFiles();
download();
function displayFiles()
test = links[c].substring(links[c].lastIndexOf('.') + 1, links[c].length);
document.getElementById('title').innerHTML = displaytext[c];
flashmovie.innerHTML =
'<object type="application/x-shockwave-flash" data="' + links[c] + '">' +
'<param name="movie" value="' + links[c] + '">' +
'<\/object>';
function download()
document.getElementById('downLink').setAttribute('href', links[c]);
window.addEventListener ?
window.addEventListener('load', init, false) :
window.attachEvent('onload', init);
);`
希望有帮助:)
【讨论】：
嘿，抱歉花了这么长时间才做出响应，但是当我暗示我的代码时，它似乎只是制作了标题，除了闪光灯之外的任何按钮都因某种原因消失了，使闪光灯全屏 Nvm 我发现我忘了在我的href标签中包含下载属性并且忘记更改它我将在下面发布正确的javascript 添加html标签也一样，你可以用它的名字下载它以上是关于如何使用javascript制作动态变化的下载链接？的主要内容，如果未能解决你的问题，请参考以下文章
如何使用 javascript 获取动态变化的 div 的高度？ [复制]
如何根据内容动态制作 Swift UIStackView 大小？