Question

http://jsfiddle.net/rATW7/这有效，但速度很慢，并显示链接<a href="downloadFile.zip" id="download" class="button">Download the file...</a>，直到javascript完全加载，然后将其替换为newElement.innerHTML = "You can download the file in 10 seconds.";，因此我决定将样式应用于{{ 1}} <a ....

下载文件......

在javascript中怎么能在时间结束后达到0删除样式或将其更改为display:none;？

是否有任何jquery替代品？

Answer 1

最简单的方法是使用两个元素。一个用于通知何时可以下载文件而另一个是实际下载按钮。内部完成后，您只需切换两个

的可见性

HTML：

<a href="downloadFile.zip" id="download" class="button" style="display: none">Download the file...</a>
<p id="notice">You can download the file in 10 seconds</p>

JavaScript的：

$(document).ready(function () {
    var counter = 10;
    var id = setInterval(function() {
       counter--;
       if(counter > 0) {
            var msg = 'You can downnload the file in ' + counter + ' seconds';
            $('#notice').text(msg);
       } else {
            $('#notice').hide();
            $('#download').show();
            clearInterval(id);
      }
    }, 1000);
});

小提琴：http://jsfiddle.net/rATW7/26/

Answer 2

如果您将链接设置为最初为display: none;，然后使用JavaScript将显示设置为inline，则应该没问题。

请在此处查看更改：http://jsfiddle.net/H3XrV/

请注意CSS中的display: none;以及显示元素的以下JavaScript行：

downloadButton.style.display = 'inline';

Answer 3

这不完全是你所拥有的，但听起来jQuery delay对你有用。

在x秒后显示链接

3 个答案: