如何使用 setInterval() 更改文本？

发布于 2024-11-06 23:48:48 字数 1147 浏览 0 评论 0原文

我已经在这方面工作了一段时间了。我正在尝试创建一个简单的倒计时计时器。我已经让alert() 正常工作，但不幸的是textToChange 没有改变。我在下面复制了我的代码的副本。任何帮助将不胜感激！谢谢。

<script type="text/javascript">
    var timeLeft = 0;
    var changingTextElement;
    var changingText = new Array();
    var ctr = 0;

    function timeMsg(thing)
    {
    var length = thing.inputbox.value*1000;
    var t = setTimeout("alertMsg()",length);
    timeLeft = length/1000;
    initChangeText();
    }

    function alertMsg()
    {
    alert("Alert!");
    }

    function initChangeText(){
        changingTextElement = document.getElementById("textToChange");
        changingText[ctr] = changingTextElement.innerHTML;
        ctr++;
        while(timeLeft > 0){
            changingText[ctr] = timeLeft;
            timeLeft--;
            ctr++;
        }
        ctr = 0;    
        setInterval("changingText()",1000);
    }

    function changingText() {
        ctr++;
        if(ctr >= changingText.length){
            changingTextElement.innerHTML = 0;
        }
        else{
            changingTextElement.innerHTML = changingText[ctr];
        }
    }

</script>

原文

I've been working at this for quite some time now. I'm trying to create a simple timer that counts down. I've gotten the alert() to work, but unfortunately the textToChange does not change. I've reproduced a copy of my code below. Any help would be greatly appreciated! Thank you.

<script type="text/javascript">
    var timeLeft = 0;
    var changingTextElement;
    var changingText = new Array();
    var ctr = 0;

    function timeMsg(thing)
    {
    var length = thing.inputbox.value*1000;
    var t = setTimeout("alertMsg()",length);
    timeLeft = length/1000;
    initChangeText();
    }

    function alertMsg()
    {
    alert("Alert!");
    }

    function initChangeText(){
        changingTextElement = document.getElementById("textToChange");
        changingText[ctr] = changingTextElement.innerHTML;
        ctr++;
        while(timeLeft > 0){
            changingText[ctr] = timeLeft;
            timeLeft--;
            ctr++;
        }
        ctr = 0;    
        setInterval("changingText()",1000);
    }

    function changingText() {
        ctr++;
        if(ctr >= changingText.length){
            changingTextElement.innerHTML = 0;
        }
        else{
            changingTextElement.innerHTML = changingText[ctr];
        }
    }

</script>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

最冷一天 2024-11-13 23:48:48

您正在使用 changingText 函数和 changingText 数组...

看到冲突了吗？

作为附加信息，

请勿在 setInterval 方法中使用字符串作为名称函数。直接使用对该方法的引用

setInterval(changingText, 1000);

You are using a changingText function and a changingText array ...

See the conflict ?

As additional info,

do not use strings as name functions in the setInterval method. Use a reference to the method directly

setInterval(changingText, 1000);

回复收藏 0 原文

美胚控场 2024-11-13 23:48:48

对于一个简单的倒计时器来说，这段代码太大了。基本上，您应该做的是：

设置应该倒计时的秒数
使用 setInterval 启动计时器，该计时器会递减计数器并显示它

这可以很简单：

var countFrom;
var timer;
function run_timer() {
    document.getElementById("textToChange").innerHTML = --countFrom;
    // !0 evaluates to true, if the counter reaches 0 (wait 0 seconds) ...
    if (!countFrom) {
        clearInterval(timer);
        alert("Timer finished!");
    }
}
function init_timer () {
    // stop previous timers if any
    clearInterval(timer);
    // start counting from 30 seconds
    countFrom = 30;
    timer = setInterval(run_timer, 1000);
}

For a simple countdown timer, this code is too big. Basically, what you should be doing is:

Set the number of seconds from which should be counted down
Start a timer using setInterval which decrements the counter and displays it

That can be simple as:

var countFrom;
var timer;
function run_timer() {
    document.getElementById("textToChange").innerHTML = --countFrom;
    // !0 evaluates to true, if the counter reaches 0 (wait 0 seconds) ...
    if (!countFrom) {
        clearInterval(timer);
        alert("Timer finished!");
    }
}
function init_timer () {
    // stop previous timers if any
    clearInterval(timer);
    // start counting from 30 seconds
    countFrom = 30;
    timer = setInterval(run_timer, 1000);
}

回复收藏 0 原文