javascript - передача дополнительных параметров в обработчик событий - PullRequest
Новая
       28

javascript - передача дополнительных параметров в обработчик событий

1 голос
/ 08 июня 2010

У меня есть объект 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>

1 Ответ

2 голосов
/ 08 июня 2010

Немного возни: 

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

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

Теперь this внутри evtHandler ссылается на ожидаемый вами объект.

...