Question

我有一个javascript对象，它有一些已定义的变量并附加了一些事件处理程序。我希望事件处理程序能够访问已定义的变量。有没有办法做到这一点？事件处理程序位于其自己的本地范围内，因此无法访问对象变量。有没有办法在不使用全局变量的情况下传递它们？

我知道闭包会解决这个问题，但我不确定如何。

下面的代码将在页面加载时打印对象名称，但是当您单击地图dom对象时，它将表示名称未定义。

非常感谢。

科尔姆

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Map Test</title>
        <meta charset="utf-8" />
        <script type="text/javascript">
            window.onload = function() {
                var e = new EvtTest();
                e.printName();
                e.attachEvents();
            };

            function EvtTest() {
                this.name = "EvtTest";
            }

            EvtTest.prototype.name = null;

            EvtTest.prototype.attachEvents = function () {
                var map = document.getElementById("map");
                map.addEventListener ('click', this.evtHandler, false);
            };

            EvtTest.prototype.printName = function () {
                console.log ("This Name : " + this.name);
            };

            EvtTest.prototype.evtHandler = function (e) {
                e.preventDefault();
                console.log ("Name : " + this.name);
            };
        </script>
        <style type="text/css">
            html, body {
                height:100%;
                width:100%;
                margin: 0;
                background-color:red;
            }
            #map {
                height: 300px;
                width: 300px;
                background-color:yellow;
            }
        </style>
    </head>

    <body>
        <div id="map"></div>

    </body>
</html>

Answer 1

一点点摆弄：

EvtTest.prototype.attachEvents = function () {
    var that = this;
    var map = document.getElementById("map");

    map.addEventListener ('click', function () {
        that.evtHandler();
    }, false);
};

this内的evtHandler引用您期望的对象。

javascript - 将其他参数传递给事件处理程序

1 个答案: