javascript - 将参数传递给调用的事件处理程序，即 element.onchange()； javascript

Question

我有这样一个函数:

function doSomething()
{
  // do something with select element
}

document.getElementById("selectel").onchange = doSomething;

// Call onchange event
document.getElementById("selectel").onchange();

现在，我认识到我可以直接调用该函数并传递一个参数。但我想知道是否可以在调用 onchange() 事件处理程序后将参数传递给它。我试过了

document.getElementById("selectel").onchange("hello");

，但这没有用。

感谢您的帮助。

Answer 1

您需要为您的函数绑定(bind)一个参数。我将从 Ext-JS 中复制粘贴一个函数，让您可以做到这一点。 警告:不适合初学者

/**
 * Create a new function from the provided <code>fn</code>, change <code>this</code> to the provided scope, optionally
 * overrides arguments for the call. (Defaults to the arguments passed by the caller)
 *
 * @param {Function} fn The function to delegate.
 * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
 * <b>If omitted, defaults to the browser window.</b>
 * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
 * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
 * if a number the args are inserted at the specified position
 * @return {Function} The new function
 */
function bind(fn, scope, args, appendArgs) {
    var method = fn,
        applyArgs;

    return function() {
        var callArgs = args || arguments;

        if (appendArgs === true) {
            callArgs = Array.prototype.slice.call(arguments, 0);
            callArgs = callArgs.concat(args);
        }
        else if (typeof appendArgs == 'number') {
            callArgs = Array.prototype.slice.call(arguments, 0); // copy arguments first
            applyArgs = [appendArgs, 0].concat(args); // create method call params
            Array.prototype.splice.apply(callArgs, applyArgs); // splice them in
        }

        return method.apply(scope || window, callArgs);
    };
}

你可以这样使用它

function onChange(e, customParameter) {
  // Whatever code
}

document.getElementById("selectel").onchange = bind(onChange, null, ["customParameter"], true);

当您的处理程序被调用时，附加参数将附加到事件处理程序(事件对象)传递的参数中。

此函数中有很多内容，所以请随时提出任何其他问题。

这是一个 jsfiddle，可以看到它的实际效果 http://jsfiddle.net/yBhG6/