jquery - 带有变量函数名称的 addEventListener 语法第 2 部分

Question

有人问过同样的问题，但在不同的背景下：

我有两个 div：

<div id='content'>Click Me!</div>
<div id='Div1'></div>

此代码有效（单击单击我时显示“功能 A”！）：

$(document).ready(function () {
setUp("1");
});

function setUp(i) {
    $('#content').on( 'mouseup', function( ) {f_A( );} )
}

function f_A() {
    $('#Div1').append(document.createTextNode("Function A"));
}

但是，我真正想做的setUp是根据i. 因此，function( ) { f_A( );}我需要类似function( ) { FUNCTION_NAME_DEPENDING_ON_i( );}. 我该怎么做呢？（我使用的是 jQuery 1.9.1。）

Answer 1

将您的函数存储在一个对象中（或者如果您使用索引，则存储在一个数组中）：

$(document).ready(function () {
    // Note: instead of '1', you could pass 'f_A' or similar 
    setUp("1");
});

function setUp(i) {
    $('#content').on( 'mouseup', function( ) {funcs[i]( );} )
}

// Note: instead of '1' you could use readable names as the key: 'f_A' or similar
var funcs = {
    "1": function f_A() {
        $('#Div1').append(document.createTextNode("Function A"));
    }
};

演示

注意：如果您想在被调用函数中拥有与事件处理程序相同的上下文，请使用以下形式：

$('#content').on( 'mouseup', function(evt) {funcs[i].call(this, evt);} )

Answer 2

好的，我会尽力给出你的答案

使用 switch 语句// 如果您的 i 值限制在某个可管理的范围内，例如 4 5
，您可以这样做

function setUp(i) {
    $('#content').on( 'mouseup', function( ) {
switch(i){
   case 1: funcs[1]( ); // and so on }} 

)}