VPF::Prototype и Event - Форум программистов

izOne

Дата 14.2.2007, 12:37 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 232
Регистрация: 22.8.2003
Где: Украина, Киев

Репутация: нет
Всего: 4

Код


Event.observe($('imagemap'), 'mousemove', function(event){
    $('coordinates').show();
});
Event.observe($('imagemap'), 'mouseout', function(event){
    $('coordinates').hide();
});
Event.observe($('imagemap'), 'click', function(event){
    var aBlockInfo = getBlockInfo(event);
    var form = document.createElement('form');
    form.action = '/formaction';
    form.method = 'post';
    form.id = 'formaction';
    var input = document.createElement('input');
    input.type='hidden';
    input.name='blocks';
    input.value=aBlockInfo[0];
    form.appendChild(input);
    $('body').appendChild(form);
    Event.stopObserving($('imagemap'), 'mousemove', null);
    Event.stopObserving($('imagemap'), 'mouseout', function(){});
    //form.submit();
});

Вот stopObserving и не работает(продолжается обработка mouseout и mouseover) smile

Подскажите, пожалуйста, как побороть.

--------------------

Успех ждет каждого, но иногда всю жизнь.

AKS

Дата 14.2.2007, 14:03 (ссылка)

(нет голосов)

Загрузка ...

Участник форума

Профиль
Группа: Участник
Сообщений: 725
Регистрация: 20.9.2006

Репутация: 27
Всего: 52

izOne, вот здесь же все расписано, а именно - какие аргументы должен получить метод для правильной работы...

izOne

Дата 14.2.2007, 14:30 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 232
Регистрация: 22.8.2003
Где: Украина, Киев

Репутация: нет
Всего: 4

AKS,
Я читал эту документацию и не понял что передавать в качестве observer в stopObserving(element, name, observer, useCapture) когда вешается на обсервинг не конкретная функция, а анонимная.

--------------------

Успех ждет каждого, но иногда всю жизнь.

AKS

Дата 14.2.2007, 14:53 (ссылка)

(нет голосов)

Загрузка ...

Участник форума

Профиль
Группа: Участник
Сообщений: 725
Регистрация: 20.9.2006

Репутация: 27
Всего: 52

izOne, Вы можете передать ссылку на анонимную функцию, хотя в вашем случае нет необходимости использовать ссылки. Можно так:

Код


function F(e) {
    (e.type == 'mousemove')
     ? $('coordinates').show()
     : $('coordinates').hide();
}
Event.observe($('imagemap'), 'mousemove', F);
Event.observe($('imagemap'), 'mouseout', F);
/* когда-нибудь потом */
Event.stopObserving($('imagemap'), 'mousemove', F);
Event.stopObserving($('imagemap'), 'mouseout', F);

izOne

Дата 14.2.2007, 15:16 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 232
Регистрация: 22.8.2003
Где: Украина, Киев

Репутация: нет
Всего: 4

AKS,
Вы привели пример с именованой функцией, но вопрос был в другом ;). И что значит

Цитата

передать ссылку на анонимную функцию

если она анонимная?

--------------------

Успех ждет каждого, но иногда всю жизнь.

Sardar

Дата 14.2.2007, 16:16 (ссылка)

(нет голосов)

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317

Цитата(izOne @ 14.2.2007, 14:16

)

Вы привели пример с именованой функцией, но вопрос был в другом ;)

Цитата(izOne @ 14.2.2007, 14:16

)

если она анонимная?

Возможно удивлю, но в принципе JS нет анонимных и именованных функций. Есть значение "функция" (value), такое же как строка или число. Есть переменная, содержащая функцию, также как любое другое значение. Обращение "по имени" к функции это просто выполнение значения-функции в переменной под конкретным именем (перепиши туда другое значение что бы было ясней).
Вывод: разницы между "анонимными" и "не анонимными" функциями нет.

Что бы удалить обработчик нужно иметь на него ссылку. Передавая null или любую другую функцию ты пытаешься удалить null или эту функцию, а не обработчик зарегистрированный ранее. Таким образом можно регистрировать массу обработчиков и не думать, что кто то может его удалить, разумный подход.

Код

function registerMyEvents(obj) {
    var move, out, click; //handlers
    Event.observe($(obj), 'mousemove', (move = function(event){
        $('coordinates').show();
    });
    Event.observe($(obj), 'mouseout', (out = function(event){
        $('coordinates').hide();
    });
    Event.observe($('imagemap'), 'click', function(event){
        var aBlockInfo = getBlockInfo(event);
        var form = document.createElement('form');
        form.action = '/formaction';
        form.method = 'post';
        form.id = 'formaction';
        var input = document.createElement('input');
        input.type='hidden';
        input.name='blocks';
        input.value=aBlockInfo[0];
        form.appendChild(input);
        $('body').appendChild(form);
        Event.stopObserving($(obj), 'mousemove', move);
        Event.stopObserving($(obj), 'mouseout', out);
        //form.submit();
    });
}
registerMyEvents('imagemap');

--------------------

Опыт - сын ошибок трудных © А. С. Пушкин
Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
Оценить мои качества можно тут.

izOne

Дата 14.2.2007, 16:25 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 232
Регистрация: 22.8.2003
Где: Украина, Киев

Репутация: нет
Всего: 4

Sardar,
Ок. Тогда несколько иначе переформулиря(как удалить обсервер имея казатель на функцию я знал, спасибо что два раза показали ;)).

Код


Event.observe($('imagemap'), 'mousemove', function(event){
    $('coordinates').show();
});

конкретно для этого кода(допустим я к его изменению не имею доступа или он закодирован) я могу удалить обработчик mousemove для $('imagemap')?

--------------------

Успех ждет каждого, но иногда всю жизнь.

AKS

Дата 14.2.2007, 16:28 (ссылка)

(нет голосов)

Загрузка ...

Участник форума

Профиль
Группа: Участник
Сообщений: 725
Регистрация: 20.9.2006

Репутация: 27
Всего: 52

Никак.

P.S. Если Вы не имеете "доступа", то о чем вообще речь?

Это сообщение отредактировал(а) AKS - 14.2.2007, 16:33

izOne

Дата 14.2.2007, 16:30 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 232
Регистрация: 22.8.2003
Где: Украина, Киев

Репутация: нет
Всего: 4

AKS,
допустим я к его изменению не имею доступа или он закодирован

--------------------

Успех ждет каждого, но иногда всю жизнь.

Sardar

Дата 14.2.2007, 16:46 (ссылка)

(нет голосов)

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317

izOne, нет, т.к. DOM 2 Event разрабатывался не для JS, а вообще как технология, потому думают о многозадачности и следовательно пытаются оставить как можно меньше способов выстрелить себе в ногу. Философия такова, если не ты ставил обработчик события, значит и не тебе его удалять smile

--------------------

izOne

Дата 14.2.2007, 17:11 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 232
Регистрация: 22.8.2003
Где: Украина, Киев

Репутация: нет
Всего: 4

Sardar,
Ясно smile

Возможно это и правильно...

Sardar,

Цитата

Вывод: разницы между "анонимными" и "не анонимными" функциями нет.

Получается таки что есть - анонимную нельзя удалить из listener'ов ;)

AKS, Sardar - спасибо за обьяснения.

--------------------

Успех ждет каждого, но иногда всю жизнь.

izOne

Дата 14.2.2007, 17:49 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 232
Регистрация: 22.8.2003
Где: Украина, Киев

Репутация: нет
Всего: 4

В общем сделал так:

Код


var Imagemap = {
    object: $('imagemap'),
    move: function(event){
        var div = $('coordinates');
        var aBlockInfo = Imagemap.getBlockInfo(event);
        var sold = false;
        var skip = false;
        if(aBlockInfo[0] > 0){
            div.innerHTML = 'X: ' + aBlockInfo[1] + ' <br />' + 'Y: ' + aBlockInfo[2] + '<br />' +'N: ' + aBlockInfo[0];
            div.style.border = '1px dashed #FFF';
            div.style.left = Event.pointerX(event) + 20 + 'px';
            div.style.top =  Event.pointerY(event) + 20 + 'px';
            div.style.background = '#888';
            var avalible = true;
            for(var i=0; i<Pixels.length; i++){
                if(Pixels[i].b == aBlockInfo[0]){
                    if(Pixels[i].c > 0){
                        for(var j=0; j<Customers.length; j++){
                            if(Customers[j].id == Pixels[i].c){
                                div.innerHTML = '<h1>' + Customers[j].info.name +'</h1><img src="' + Customers[j].info.logo + '" /><br /><a href="' + Customers[j].info.href + '">' + Customers[j].info.href + '</a>';
                                div.show();
                                break;
                            }
                        }
                    }else{
                        div.hide();
                        Imagemap.object.style.cursor = 'default';
                    }
                    avalible = false;
                    break;
                }
            }
            if(avalible){
                div.innerHTML += '<br />' + '<h1>Free</h1>';
                div.show();
            }
        }
        if(aBlockInfo[1] <= 0 || aBlockInfo[2] <= 0){
            div.hide();
        }
    },
    click: function(event){
        var aBlockInfo = getBlockInfo(event);
        var form = document.createElement('form');
        form.action = '/buypixels';
        form.method = 'post';
        form.id = 'buypixel';
        var input = document.createElement('input');
        input.type='hidden';
        input.name='blocks';
        input.value=aBlockInfo[0];
        form.appendChild(input);
        $('body').appendChild(form);
        Imagemap.stop();
        form.submit();
    },
    out: function(event){
        $('coordinates').hide();
    },
    observe: function(){
        Event.observe(Imagemap.object, 'mousemove', Imagemap.move);
        Event.observe(Imagemap.object, 'click', Imagemap.click);
        Event.observe(Imagemap.object, 'mouseout', Imagemap.out);
    },
    stop: function(){
        Event.stopObserving(Imagemap.object, 'mousemove', Imagemap.move);
        Event.stopObserving(Imagemap.object, 'mouseout', Imagemap.out);
    },
    getBlockInfo: function(event){
        var map = $('imagemap');
        var mapX = Position.cumulativeOffset(map)[0];
        var mapY = Position.cumulativeOffset(map)[1];
        var pointerX = Event.pointerX(event);
        var pointerY = Event.pointerY(event);
        var correctX = pointerX - mapX - 10;
        var correctY = pointerY - mapY - 17;
        var pixelN = parseInt(correctX/10) + (parseInt(correctY/10))*25 + 1;

        return {0:pixelN, 1:correctX, 2:correctY};
    }
}
Imagemap.observe();

--------------------

Успех ждет каждого, но иногда всю жизнь.

AKS

Дата 14.2.2007, 18:07 (ссылка)

(нет голосов)

Загрузка ...

Участник форума

Профиль
Группа: Участник
Сообщений: 725
Регистрация: 20.9.2006

Репутация: 27
Всего: 52

Цитата(izOne)

Получается таки что есть - анонимную нельзя удалить из listener'ов

Удалить-то можно, вот только prototype.js этого не умеет...

izOne

Дата 14.2.2007, 18:58 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 232
Регистрация: 22.8.2003
Где: Украина, Киев

Репутация: нет
Всего: 4

AKS,
Ну тогда возвращаясь к вопросу: как? Пусть даже не через prototype, а чистым JS не имея указателя на функцию. Я не нашел решения smile

--------------------

Успех ждет каждого, но иногда всю жизнь.

Sardar

Дата 14.2.2007, 20:11 (ссылка)

(нет голосов)

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317

Цитата(AKS @ 14.2.2007, 17:07

)

Удалить-то можно, вот только prototype.js этого не умеет...

Цитата(izOne @ 14.2.2007, 17:58

)

а чистым JS

Ну на самом то деле prototype.js вызывает .addEventListener из DOM 2 Event, так что либа умеет всё, что "чистым JS" можно сделать. А сделать этого нельзя и это хорошая фича дизайна smile

--------------------

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »