Javascript - 在循环中动态分配onclick事件

Question

Javascript - 在循环中动态分配onclick事件

iho*_*rko 9 html javascript events onclick button

我有一个非常简单的html页面与js代码:

<html>
    <head>
        <title></title>
    </head>
    <body>

        <div id="divButtons">

        </div>

        <script type="text/javascript">
            var arrOptions = new Array();

            for (var i = 0; i < 10; i++) {
                arrOptions[i] = "option" + i;
            }

            for (var i = 0; i < arrOptions.length; i++) {
                var btnShow = document.createElement("input");
                btnShow.setAttribute("type", "button");
                btnShow.value = "Show Me Option";
                var optionPar = arrOptions[i];
                btnShow.onclick = function() {
                    showParam(optionPar);
                }

                document.getElementById('divButtons').appendChild(btnShow);
            }

            function showParam(value) {
                alert(value);
            }        
        </script>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

该页面绑定了10个按钮,但是当您单击任何按钮时,它始终显示警告"option9".如何分配onclick事件来显示相应的选项!

谢谢!

Answer 1

Jac*_*kin 32

你必须做这样的事情:

btnShow.onclick = (function(opt) {
    return function() {
       showParam(opt);
    };
})(arrOptions[i]);

Run Code Online (Sandbox Code Playgroud)

这里到底发生了什么？这对我有用,但我想了解以及:-) (4认同)
@MartinElvar 他创建了一个参数是 opt 的函数，然后当我们应用 (...)(arrOptions[i]) 然后它被传递给 opt 然后当我们点击 btnShow 然后这个函数被调用放。 (2认同)

归档时间：	14 年，11 月前
查看次数：	28382 次
最近记录：	8 年，11 月前