0

如何将这个图像http://svastara.info/.s/img/icon/download1.png移动到立即下载的前面?应该看起来像这样:图片立即下载

var CountdownTimer = function( id, count, imgurl ) { this.construct(id, count, imgurl); }
CountdownTimer.prototype = {
        construct: function(id,count,imgurl) {
                this.id = id;
                this.object = document.getElementById(id);
                this.count = count;
                this.interval = null;
                this.counted = false;
                this.img = new Image(); // preload
                this.img.src =  imgurl;
                this.img.border = "0";

                (function(obj) {
                        obj.object.onclick = function() {
                                return obj.onclick();
                        };
                })(this);
        },

        tick: function() {
                this.count--;
                this.render();

                if(this.count == 0){ 
                        clearInterval(this.interval);
                        this.interval = null;
                        this.object.appendChild(this.img);
                }
        },

        onclick: function() {
                if(!this.counted) {
                        this.counted = true;
                        this.render();
                        (function(obj) {
                                obj.interval = setInterval(function() {
                                        obj.tick();
                                },1000);
                        })(this);
                        return false;
                } else if(this.count == 0)
                        return true;
                else
                        return false;
        },

        render: function() {
                if(this.count > 0)
                        this.object.innerHTML = "Download (" + this.count + " second" + (this.count == 1 ? "" : "s") + ")";
                else
                        this.object.innerHTML = "Download Now";
        }

};

window.onload = function() {
        var c = new CountdownTimer("delayed",3,"http://svastara.info/.s/img/icon/download1.png");
};

<div>
<a id="delayed" class="stop" href="http://www.epiclosers.com/">Download (30sec)</a>
</div>
4

1 回答 1

0

看一下 insertBefore 方法,现有文本应该是锚标记的子节点。

话虽如此,我开始想知道为什么人们在这里做花哨的事情......你不是独一无二的,我一直看到这种事情。通过允许 HTML 和 CSS 帮助您,可以简化代码。将图像放入文档中,将显示设置为无,并在需要时将其打开。此外,下载后的文本可以在一个范围内,也可以根据您的需要进行更新。然后可以用一小部分代码来管理整个事情。关于简化的最终想法,您可以禁用链接,直到您准备好允许为止。

此外,在客户端中使用一个简单的调试器,我可以即时将计数更改为 0 并完全绕过逻辑。或者,更简单的是,我可以关闭 javascript 并单击链接。换句话说,确保您通过不在客户端中的其他方式执行它。依赖客户端来执行策略总是一个坏主意,所以在服务器端备份它。您可能正在这样做,所以请不要被评论冒犯。

于 2009-09-28T03:26:15.227 回答