Question

如何将参数传递给分配给鼠标事件的函数？我知道以下行不起作用。接收函数不接受调用顺序中的参数。我已经尝试了addEventListener并且它可以使用它，但我在移除事件方面遇到了问题，因此我希望以这种方式解决这个问题。

document.onmousemove = timesheet.draw(e,newEl);

var Timesheet = function() {
    ...
    this.draw = function(e,newEl) {
       ...
    }
}

$(document).ready(function() {
    timesheet = new Timesheet();
    document.onmousedown = function(e) {
        ...
        var newEl = $('</div');
        document.onmousemove = timesheet.draw(e,newEl);
    }

    document.onmouseup = function(e) {
        document.onmousemove = null;
    }
});

Answer 1

这是我在dom对象包装器上使用的纯javscript方法的代码片段，用于附加带有额外参数的事件。

/**
 * Attach event listener.
 * @param {string} eventName
 * @param {function} handler
 * @param {bool} useCapture
 * @param {array} extraParams
 */
AbstractViewObject.prototype.on = function (eventName, handler, useCapture, extraParams) {
    var self = this;
    var name = eventName + '-' + handler.name;
    var obj = {};

    if (typeof handler.name === 'undefined') {
        throw new Error('Can\'t register an anoymous function as handler!');
    }

    obj[name] = function (e) {
        var params = [e];
        if (Array.isArray(extraParams) && extraParams.length > 0) {
            params = params.concat(extraParams);
        }
        handler.apply(self, params);
    };
    this.eventsMap[name] = obj[name];
    this.dom.addEventListener(eventName, obj[name], useCapture);
};

/**
 * Remove event listener.
 * @param {string} eventName
 * @param {function} handler
 */
AbstractViewObject.prototype.off = function (eventName, handler) {
    var name = eventName + '-' + handler.name;
    if (this.eventsMap[name]) {
        this.dom.removeEventListener(eventName, this.eventsMap[name]);
        this.eventsMap[name] = null;
    }
    else {
        throw new Error('This object doesn\'t posses such handler. Event: ' + eventName + '. Handler: ' + handler.name);
    }
};

此代码强制基于命名的函数处理程序，以帮助维护对函数的引用，以防它们被删除。这就是您可能遇到removeEventHandler问题的原因。如果将anoymous函数添加为处理程序，则只能通过传递对同一函数的引用来删除它。所以你必须将它保存在一些var中，后者将用于删除。

分配给事件时传递参数

1 个答案: