在事件上使用 jQuery 时执行 JavaScript 函数答案

【问题标题】：Execute JavaScript function when using jQuery on event在事件上使用 jQuery 时执行 JavaScript 函数
【发布时间】：2014-12-05 12:07:41
【问题描述】：

我想在触发 on 事件时加载一个函数。

我有这个代码，但它不起作用。

    function myFunction(data){
        alert(data);
    }

    $(".element").on('keyup', myFunction('a'));

我不想这样调用函数：

    $(".element").on('keyup', function(){
         myFunction('a');
    });

我该如何进行这项工作？彼得

【问题讨论】：

【解决方案1】：

on 的委托版本允许传递数据以及函数：

$(document).on('keyup', ".element", 'a', myFunction);

function myFunction(e){
    alert (e.data);
}

注意：应该可以使用 非委托 on 处理程序传递数据，但它将 'a' 参数混淆为选择器并认为它无论如何都是委托的。

正如nnnnnn 指出的那样，如果您不想要委托的事件处理程序，可以将选择器替换为null：

$('.element').on('keyup', null, 'a', myFunction)

function myFunction(e){
    alert (e.data);
}

【讨论】：

坦率地说我从来不知道...谢谢分享。
要将数据传递给非委托事件处理程序，您需要一个 null 占位符作为第二个（选择器）参数。如文档中所示。 .on('keyup', null, 'a', myFunction)
@nnnnnn：很容易知道，我已经调整了答案以包含该版本。谢谢:)

【解决方案2】：

你可以这样做：

function myFunction(data){
    return function(){
        alert(data);
    }
}

$(".element").on('keyup', myFunction('a'));

您将创建一个始终使用 data 调用 alert 函数的函数。

您也可以轻松地重复使用它

$(".element").on('keydown', myFunction('b'));

【讨论】：

【解决方案3】：

jQuery 需要一个回调函数。您可以将函数作为参数传递，例如：

function my_fx(data){
    console.log(data)
}

$(".elem").on("keyup", my_fx); // data argument will be a jQuery Event object

但如果您需要自定义信息，您可以像这样进行闭包：

function make_fx(custom_data){
    return function(jquery_event){
        console.log(custom_data);
    }
}

$(".elem").on("keyup", make_fx("foo"));

【讨论】：