在没有 eventData 的情况下通过 jQuery 事件调用传递匿名函数

Question

给定一个 <input id="foo"> 元素，我想在 blur 上调用一个 existing 函数并将匿名回调传递给它。

案例一，简单的函数调用：

function bar(){
    alert("I am");
}

$("#foo").blur(bar); //Works fine

情况2，通过arguments/function：

$("#foo").bind("blur", {func: function(){console.log("I am apple")}}, bar);

function bar(event){
    event.data.func(); //Works fine
};

案例 2 的问题是我希望 bar() 作为一个通用函数被 more than blur 调用，在这种情况下我将直接传递匿名函数，而不是 "baked"一个数据对象。理想情况下是这样的：

function bar(callback){
    //Do stuff
    callback();
}

bar(function(){console.log("Hello Earth")}); //Works

$("#foo").blur(bar(function(){console.log("Hello world")})); //Doesn't work

最后一行不起作用，因为函数直接执行，但它是我想要实现的示例。我想我可能可以在 bar() 中进行一些 typeof 检查以确定我收到的是什么，但我想问一下是否有一种更简洁的方法来在 blur 上传递匿名函数，而不是更改 bar()。

Answer 1

...I wanted to ask if there's a cleaner way to pass anonymous function on blur, instead of changing bar().

不太清楚你的意思，你必须更改 bar 或换行 bar。

改变它：

使 bar 成为处理程序 生成器 而不是直接处理程序：

function bar(callback) {
    return function(e) {
        // You could use `e` (the event) here and/or pass it on to the callback
        callback();
        // You might use the callback's return, e.g.:
        // return callback();
        // ...if you wanted it to be able to `return false`
    };
}

现在，bar returns 一个将调用回调的事件处理程序（另外，大概是做它自己的事情；否则，它有点毫无意义，您只需通过直接回调）。

用法：

$("#foo").blur(bar(function(){console.log("Hello world")}));

包装它

如果你的字面意思是你不想改变栏，你需要包装它：

function wrap(f, callback) {
    return function() {
        // You could call `callback` here instead of later if you like

        // Call the original function passing along the `this` and
        // arguments we received (`arguments` isn't pseudo-code, it's
        // a pseudo-array JavaScript creates for you), get its return value
        var retval = f.apply(this, arguments);

        // Call the callback
        callback();

        // Return the original function's return value
        return retval;
    };
}

如果你想避免让 callback 抛出的错误进入事件机制，你可以将其包装在 try/catch.

中

用法：

$("#foo").blur(wrap(bar, function(){console.log("Hello world")}));

Answer 2

包装它并return它作为一个匿名函数：

function bar(callback){
    return function() {
        callback();
    }
}

// direct
bar(function(){console.log("Hello Earth")})();

// as callback
$("#foo").blur(bar(function(){console.log("Hello world")}));

Answer 3

function bar(callback){
    //Do stuff
    callback();
}

bar(function(){console.log("Hello Earth")}); //Works

$("#foo").blur(bar.bind(this,function(){console.log("Hello world")})); //Will work

Answer 4

function bar(){
    alert("I am blur");
}

$("#foo").bind('blur',bar);

Answer 5

Last line doesn't work as function gets executed directly

$("#foo").blur(bar(function(){console.log("Hello world")}));

在最后一行，您将 bar 的 result 传递给 blur() 函数，而不是 bar 本身，它与：

var result = bar(function(){console.log("Hello world")});
$("#foo").blur(result);

标准方法是将其包装在匿名函数中：

$("#foo").blur(function() { bar(function(){console.log("Hello world")}) });

这意味着根据问题要求，您的其他现有功能没有变化：“而不是更改 bar()”

在没有 eventData 的情况下通过 jQuery 事件调用传递匿名函数

Passing anonymous functions through jQuery event call without eventData

javascript

jquery

anonymous-function

改变它：

包装它