addEventListener

@SphiNkSs · Регистрация: 28.03.2010

Студворк — интернет-сервис помощи студентам

Вопрос может показаться странным, просто я только начинаю вникать в js...
Суть в следующем:
Я создаю класс для работы с canvas.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
function CanvaDrw(cnv_id, w, h, s)
{
    Canva.call(this, cnv_id, w, h, s); //наследую методы из другого класса 
                                                        //(он отношения к проблеме не имеет)
                                                        //главное что здесь наследуется свойство this.canvas
                                                        //в котором хранится указатель на канву
    
    this.canvas.addEventListener('click',doSomething,false);//назначаю событие 
    
    function doSomething() 
    {
    alert(2);
    }   
}

Я инициализирую экземпляр этого класса:

JavaScript
1
var cnv = new CanvaDrw("canva",800,600,10);

И все работает так как надо, то есть при каждом клике всплывает сообщение "2".
НО
Мне требуется чтобы в функцию doSomething передавался указатель на экземпляр класса для доступа к именно этой канве!
Пишу:

JavaScript
1
2
3
4
5
this.canvas.addEventListener('click',doSomething(this),false);//назначаю событие 
function doSomething(w) 
{
alert(w.canvas);
}

И он передает указатель как надо, но выполняет код doSomething почемуто сразу при назначении события, а после ни на какие клики мыши не реагирует, словно я и не назначал это событие...
Я отметил тенденцию, что если при назначении события у назначаемой функции указать хоть какие аргументы (напирмер doSomething(this)), то он выполняет эту функцию только сразу при назначении события, а если не указывать (например doSomething) то все работает как надо...
И я не могу понять как мне передать в функцию события указатель на экземпляр так, чтобы функция выполнялась именно при клике...

Может я изначально в чем то не прав? Может класс не так создаю? Может неправильно событие задаю? Может указатель на экземпляр и не надо передавать, а объявить как нибудь особенно???
Подскажите, пожалуйста, в какую сторону думать дальше??? ...ну совсем в тупик зашел...

Добавлено через 18 часов 35 минут
неужели совсем никто не сталкивался с классами на js?? =((

@uggway · 25.03.2011, 18:49

А причем тут "классы на js"?
Здесь:

JavaScript
1
this.canvas.addEventListener('click',doSomething(this),false);//назначаю событие

ты вызываешь функцию doSomething(this) и ее результат передаешь в addEventListener.
Может быть как-то так...

JavaScript
1
this.canvas.addEventListener('click',function(){doSomething(this)},false);//назначаю событие

Vovan-VE · 25.03.2011, 18:59

Сообщение от uggway

Может быть как-то так...

Только там внутри надо не this, возможно, а через переменную передать то this, которое было в момент назначения. Смотря что автору нужно.

@SphiNkSs · 25.03.2011, 23:19 **[ТС]**

2uggway
спасибо пребольшущее

все заработало примерно так как надо!

дико счастлив,
что хоть так пашет

2vovan-ve
вобще нужно передать ссылку на экземпляр класса, а он передает ссылку на канву... Но хоть так

а что по Вашему следует написать вместо this, чтобы передать ссылку именно на экземпляр?

Vovan-VE · 26.03.2011, 06:15

Сообщение от SphiNkSs

а что по Вашему следует написать вместо this, чтобы передать ссылку именно на экземпляр?

JavaScript
1
2
var self = this;
this.canvas.addEventListener('click',function(){doSomething(self)},false);

@SphiNkSs · 27.03.2011, 10:29 **[ТС]**

Всем огромное спасибо) теперь все работает как надо!

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .	SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .

@SphiNkSs 5 / 5 / 3 Регистрация: 28.03.2010 Сообщений: 146
	25.03.2011, 23:19 [ТС]
	2uggway спасибо пребольшущее все заработало примерно так как надо! дико счастлив, что хоть так пашет 2vovan-ve вобще нужно передать ссылку на экземпляр класса, а он передает ссылку на канву... Но хоть так а что по Вашему следует написать вместо this, чтобы передать ссылку именно на экземпляр? 0

@SphiNkSs 5 / 5 / 3 Регистрация: 28.03.2010 Сообщений: 146
	27.03.2011, 10:29 [ТС]
	Всем огромное спасибо) теперь все работает как надо! 0