Question

我知道可以通过在onclick事件中添加“ bild1”，“ bild2”和“ bild3”来轻松解决此任务，但是我想尝试使用数组来解决此问题，但似乎不起作用.. 我究竟做错了什么？函数甚至可以保存在数组中吗？

谢谢。

<html>
    <body>
        <img src="bild1.png">
        <button onclick="meinArray[0]">Bild1</button>
        <button onclick="meinArray[1]">Bild2</button>
        <button onclick="meinArray[2]">Bild3</button>
        <script>
            let meinArray = new Array();
            meinArray[0] = bild1();
            meinArray[1] = bild2();
            meinArray[2] = bild3();

            <!-- let i = 0; -->
            function bild1(){
                document.images[0].src = "bild1.png";
            }

            function bild2(){
                document.images[0].src = "bild2.png";
            }

            function bild3(){
                document.images[0].src = "bild3.png";
            }
        </script>
    </body>
</html>

Answer 1

您需要保存对函数的引用，而不是执行它们：

meinArray[0] = bild1;
meinArray[1] = bild2;
meinArray[2] = bild3;

然后像这样执行它们：

<button onclick="meinArray[0]()">Bild1</button>

Answer 2

您可以转换为一个函数，仅将值存储在数组中，而不必为每个新图像编写很多函数

function bild(index){ document.images[0].src = index; }

<img src="bild1.png">
<button onclick="bild('bild1.png')">Bild1</button>
<button onclick="bild('bild2.png')">Bild2</button>
<button onclick="bild('bild3.png')">Bild3</button>

是否可以将函数保存在数组中？

2 个答案: