javascript 更改所有三条消息后,如何停止间隔?

nvbavucw  于 2023-02-11  发布在  Java
关注(0)|答案(3)|浏览(99)

我需要在更改所有留言后停止间隔,但我不能。您能帮助我吗?谢谢。

<script>
$(document).ready(function(){
    var textos = ["Hi", "Fine?", "0"];
    var atual = 0;
    $('#display').text(textos[atual++]);
    setInterval(function() {
        $('#display').fadeOut(function() {
            if (atual >= textos.length) atual = 0;
            $('#display').text(textos[atual++]).fadeIn();
        });
    }, 10);
});
</script>
q9rjltbz

q9rjltbz1#

用于循环?或者在需要时将其放入变量和cleat中

<script>
    $(document).ready(function(){
        var textos = ["Hi", "Fine?", "0"];
        var atual = 0;
      // here
        var intervalId;
        $('#display').text(textos[atual++]);
        intervalId = setInterval(function() {
            $('#display').fadeOut(function() {
                if (atual >= textos.length) {
            // clear
                    clearInterval(intervalId);
                } else {
                    $('#display').text(textos[atual++]).fadeIn();
                }
            });
        }, 1000);
    });
</script>

要保持最后一个试试这个

$(document).ready(function(){
    var textos = ["Hi", "Fine?", "0"];
    var atual = 0;
    var intervalId;

    $('#display').text(textos[atual++]);
    intervalId = setInterval(function() {
        if (atual >= textos.length - 1) {
            clearInterval(intervalId);
        } else {
            $('#display').fadeOut(function() {
                $('#display').text(textos[atual++]).fadeIn();
            });
        }
    }, 1000);
});

无动画

$(document).ready(function(){
    var textos = ["Hi", "Fine?", "terwer", "ewrew rwer", "sdfdsf"];
    var index = 0;

    function showText() {
        if (index >= textos.length) {
            return;
        }

        var text = textos[index];
        $('#display').append(text + ' ');

        setTimeout(function() {
            removeText(text);
        }, 4000);

        index++;
        setTimeout(showText, 1000);
    }

    function removeText(text) {
        var elements = $('#display').children();
        for (var i = 0; i < elements.length; i++) {
            var element = $(elements[i]);
            if (element.text().trim() == text) {
                element.remove();
                break;
            }
        }
    }

    showText();
});
hwamh0ep

hwamh0ep2#

如果您的目标是停止间隔,则可以使用clearInterval()

<script>
$(document).ready(function(){
    var textos = ["Hi", "Fine?", "0"];
    var atual = 0;
    $('#display').text(textos[atual++]);
    let myinterval = setInterval(function() {
        $('#display').fadeOut(function() {
            if (atual >= textos.length) atual = 0;
            $('#display').text(textos[atual++]).fadeIn();
        });
    }, 10);
    // later when you want to stop it:
    clearInterval(myinterval);
});
</script>

你可以在这里罚款更多:https://developer.mozilla.org/en-US/docs/Web/API/clearInterval

dxxyhpgq

dxxyhpgq3#

使用清除间隔停止当前间隔。

<script>
    $(document).ready(function(){
        
        var textos = ["Hi", "Fine?", "0"];
        var atual = 0;
        $('#display').text(textos[atual++]);
       var interval = setInterval(function() {
            $('#display').fadeOut(function() {
                if (atual >= textos.length) atual = 0;
                $('#display').text(textos[atual++]).fadeIn();
            });
            clearInt();
        }, 10);
        function clearInt(){
            clearInterval(interval);
        }
    });
 </script>

这对你有帮助。

相关问题