Доступ к объекту события в обработчике события

Question

Когда я пытаюсь присоединить функции обработчика событий с такими параметрами, как:

myhandle.onclick = myfunction(param1,param2);

function myfunction(param1,param2){
}

Теперь я хочу получить доступ к объекту события в моей функции-обработчике. В Интернете упоминается подход отправки объекта события, например:

myhandle.onclick = myfunction(event,param1,param2);

Но когда я его тестирую, объект события, который он выдал, не определен.

Я знаю, библиотеки облегчают эту задачу, но я ищу нативный вариант JS.

Answer 1

myhandle.onclick = myfunction (param1, param2);

Это распространенная ошибка новичка на уровне JavaScript, а не то, что библиотеки действительно могут исправить для вас.

Вы не назначаете myfunction в качестве обработчика щелчка, вы вызываете myfunction, с аргументами param1 и param2 и присваиваете возвращаемое значение функции для onclick. myfunction ничего не возвращает, поэтому вы бы присваивали undefined onclick, что не имело бы никакого эффекта ..

То, что вы имеете в виду, это присвоить ссылку самой myfunction:

myhandle.onclick= myfunction;

Чтобы передать функции некоторые дополнительные аргументы, вы должны сделать замыкание, содержащее их значения, что обычно делается с помощью анонимной встроенной функции. Он также может позаботиться о передаче события, если вам нужно (хотя в любом случае вам нужен план резервного копирования для IE, где объект события не передается в качестве аргумента):

myhandle.onclick= function(event) {
    myfunction(param1, param2, event);
};

В пятом издании ECMAScript, которое станет будущей версией JavaScript, вы можете написать это еще проще:

myhandle.onclick= myfunction.bind(window, param1, param2);

(с window является фиктивным значением для this, которое вам в этом случае не понадобится.)

Однако, поскольку многие современные браузеры не поддерживают пятое издание, если вы хотите использовать этот метод, вы должны предоставить реализацию для старых браузеров. Некоторые библиотеки уже включают одну; вот еще один автономный.

if (!('bind' in Function.prototype)) {
    Function.prototype.bind= function(owner) {
        var that= this;
        var args= Array.prototype.slice.call(arguments, 1);
        return function() {
            return that.apply(owner,
                args.length===0? arguments : arguments.length===0? args :
                args.concat(Array.prototype.slice.call(arguments, 0))
            );
        };
    };
}

Answer 2

Я не совсем уверен, что вы пытаетесь сделать, но, возможно, что-то вроде этого - то, что вы ищете?

function myfunction(param1, param2){
    return function(event) {
        // For compatibility with IE.
        if (!event) {
            event = window.event;
        }

        alert("event = " + event + ", param1 = " + param1 + ", param2 = " + param2);
    };
}

myhandle.onclick = myfunction(param1, param2);

Конечным результатом этого является то, что анонимная функция внутри myfunction будет вызываться как обработчик onclick, что приведет к событию плюс два печатаемых параметра. Два параметра фиксируются во время добавления обработчика событий, в то время как event будет меняться каждый раз, когда пользователь нажимает myhandle.

Answer 3

Попробуйте это:

if (!event) { event = window.event; }

внутри myfunction ().