当时只有一个计时器工作(html + js)

时间:2016-02-17 13:24:09

标签: javascript html

我有一个计时器,我想在我网站的两个不同的地方。但当时只有一个人在工作。

下面是Script +第一个计时器。

 <script>
    var interval;
    var minutes = 8;
    var seconds = 41;
    window.onload = function() {
        countdown('countdown');
        myFunction();
        myFunctiontoo();

    }

    function countdown(element) {
        interval = setInterval(function() {
            var el = document.getElementById("timerx");
            if(seconds == 0) {
                if(minutes == 0) {
                    el.innerHTML = "Free trial bonus has expired!";                    
                    clearInterval(interval);
                    return;
                } else {
                    minutes--;
                    seconds = 60;
                }
            }
            if(minutes > 0) {
                var minute_text = minutes + (minutes > 1 ? ' minutes' : ' minute');
            } else {
                var minute_text = '';
            }
            var second_text = seconds > 1 ? 'seconds' : 'second';
            el.innerHTML = minute_text + ' ' + seconds + ' ' + second_text + '';
            seconds--;
        }, 1000);
    }
    </script>

    <div class="countdown"><span style="color:#EA0423;">Free Trial bonus ends in </span><span id="timerx" style="font-weight:bold;">8 minutes and 42 seconds</span>.
  </div>

我的HTML代码略低一点,我有另一个计时器。

<span style="color:#FFF1D6;">Free Trial bonus ends in </span><span id="timerx" style="font-weight:bold;">8 minutes and 42 seconds</span>.

遗憾的是,第二个计时器无效。

2 个答案:

答案 0 :(得分:1)

除了getElementsByClassName之外的方法getElementById只返回一个DOM元素。

方法getElementsByClassName返回一个元素数组,以便您可以使用索引获取它们

以下是工作示例:PLUNKER

您可以使用getElementsByClassName,您的代码如下所示:

string = string.replaceAll("<.*?>","");

答案 1 :(得分:0)

如果您在同一页面中两次调用计时器,则需要有两个ID。 id =“timerx”

<span id="timerx_"<?php echo 'DYNAMIC VARIBALE'; ?>>timer</span>

并使用此新ID