Как я могу остановить событие по умолчанию при использовании именованной функции в addEvent?

Question

Обычно, если я хочу остановить событие по умолчанию в mootools, я могу сделать это:

$('form').addEvent('submit', function(e) {
    e.stop();

    //Do stuff here
    });

Однако мне не нравится использовать анонимную функцию в событиях, потому что я часто хочу повторно использовать код. Допустим, у меня есть функция проверки. Я мог бы сделать это:

$('form').addEvent('submit', validate);

, который работает нормально, пока я не хочу остановить событие по умолчанию. validate, очевидно, не знает, что такое e, поэтому я не могу просто сделать e.stop (). Также я попытался передать событие в качестве переменной для проверки, но всякий раз, когда я использую именованную функцию с параметрами, функция вызывается автоматически при готовности, а не при срабатывании события. Хуже того, при возникновении события выдается ошибка.

Что я делаю не так?

ОБНОВЛЕНИЕ: Здесь представлена ​​функция проверки в полном объеме, на всякий случай. Однако, поскольку ошибка возникает после первой строки, я сомневаюсь, что что-либо после вызывается, так что это, вероятно, не имеет значения.

var validate = function(e) {
    e.stop();

    if(this.get('tag') === 'form') {
        this.getElements('input.text').each(validate);
        }
    else {
        element = this;
        div = element.getParent();
        input = element.get('value');
        filter = JSON.decode(div.get('filter'));

        if(!filter.some(function(value, key) {
            if(value === 'required') if(!setAndNotEmpty(element, input)) return true;
            if(value === 'email') if(!isEmail(element, input)) return true;
            if(value === 'date') if(!isDate(element, input)) return true;
            if(value === 'time') if(!isTime(element, input)) return true;
            if(key === 'chars') if(!charsLessThan(element, input, value)) return true;
            if(key === 'words') if(!wordsLessThan(element, input, value)) return true;
            return false;
            })) setFault('', element);
        }
    }

Answer 1

вам нужно объявить «validate» следующим образом:

function validate(e){
}

Тогда вы можете использовать e.stop ()

function validate(e){
    e.stop();
}

$('form').addEvent('submit', validate);

Следует отметить, что в jQuery вы также можете вернуть результат из метода, чтобы остановить распространение. Я не уверен, что mootools позволяет это, но вы могли бы сделать это:

function validate(e){
    return false;
}

$('form').addEvent('submit', validate);

Чтобы ответить на вопрос «что я делаю не так» - вы просто неправильно понимаете, что происходит, когда вы передаете анонимный метод. Передача анонимного метода function(e) {} - это , а не , что вызывает передачу e, это просто определение имени первого передаваемого аргумента. Объект события будет передан в метод независимо от того, будет ли он метод присваивает имя аргументу, поэтому вы обнаружите, что следующее также будет работать:

function validate(){
    arguments[0].stop();
}

$('form').addEvent('submit', validate);

Answer 2

bindWithEvent Изменяет область этого в целевой функции, ссылаясь на параметр связывания. Это также делает "пространство" для события. Это позволяет использовать функцию вместе с Element: addEvent и arguments.

protectDefault Кросс-браузерный метод для предотвращения действия события по умолчанию.

function validate(e)
{
    e.preventDefault();

    if(this.get('tag') === 'form') {
    this.getElements('input.text').each(validate);
    }
    else {
        element = this;
        div = element.getParent();
        input = element.get('value');
        filter = JSON.decode(div.get('filter'));

    if(!filter.some(function(value, key) {
        if(value === 'required') if(!setAndNotEmpty(element, input)) return true;
        if(value === 'email') if(!isEmail(element, input)) return true;
        if(value === 'date') if(!isDate(element, input)) return true;
        if(value === 'time') if(!isTime(element, input)) return true;
        if(key === 'chars') if(!charsLessThan(element, input, value)) return true;
        if(key === 'words') if(!wordsLessThan(element, input, value)) return true;
        return false;
        })) setFault('', element);
}

$('form').addEvent('submit', validate.bindWithEvent(this));

Довольно понятно, когда вы видите слова prevent default рядом друг с другом. Поэтому, когда вы отправляете форму, страница не переходит к вашим действиям.

Answer 3

$('form').addEvent('submit', function(e) {
    e.stop();

    //Do stuff here
    }

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

$('form').addEvent('submit', function(e)) {

Ваш аргумент 'e' не был должным образом закрыт в первой строке.