循环函数执行 onclick JavaScript

Loop function executed onclick JavaScript

大家好,我正在尝试创建一个循环函数,以便每次单击按钮时内容都会改变。我哪里错了?现在当我点击按钮(循环中的最后一个)时它会改变 Testimonial2

function arrayOfTestimonials() {
    var arrayOfFunctions = [];
    arrayOfFunctions.push(changeTestimonial);
    arrayOfFunctions.push(changeTestimonial1);
    arrayOfFunctions.push(changeTestimonial2);

    for (var i = 0; i < arrayOfFunctions.length; ++i) {
        arrayOfFunctions[i](); // run your function
    }
}

按照您编写这段代码的方式,它应该可以工作。我做了测试...

代码

<body>
    <script type="text/javascript">
        console.log("test");

        var fun1 = function(){
            console.log("fun1");
        }

        var fun2 = function(){
            console.log("fun2");
        }

        var fun3 = function(){
            console.log("fun3");
        }

        function arrayOfTestimonials() {
            var arrayOfFunctions = [];
            arrayOfFunctions.push(fun1);
            arrayOfFunctions.push(fun2);
            arrayOfFunctions.push(fun3);

            for (var i = 0; i < arrayOfFunctions.length; ++i) {
                arrayOfFunctions[i](); // run your function
            }
        }

        arrayOfTestimonials();
    </script>
</body>

输出

test
fun1
fun2
fun3

如果你想一个函数一个函数调用,你应该这样做...

<body>
    <button onclick="onClickButton()">click me!</button>
    <h2 id="title">No function has been called!</h2>

    <script type="text/javascript">
        var functionNumber = 1;

        var fun1 = function(){
            document.getElementById("title").innerHTML = "Function 1 has been called!";
        }

        var fun2 = function(){
            document.getElementById("title").innerHTML = "Function 2 has been called!!";
        }

        var fun3 = function(){
            document.getElementById("title").innerHTML = "Function 3 has been called!!!";
        }

        function onClickButton(){
            if(functionNumber === 1){
                fun1();
                functionNumber++;
            }else if(functionNumber === 2){
                fun2();
                functionNumber++;
            }else if(functionNumber === 3){
                fun3();
                functionNumber = 1;
            }
        }
    </script>
</body>