为每个索引参数分配不同的函数

Question

我有这个代码。

$('#my-container-div').on('onAlbumLoad', function(event, index) {
...
});

我需要为索引的每个实例分配不同的函数，但不知所措。

在非编码人员的术语中，我正在寻找：如果索引等于 0，则执行此操作，如果索引等于 1，则执行此操作，如果索引等于 3，则执行此操作，依此类推。

Answer 1

我没有很好地了解您正在尝试做的事情的整体背景，无法知道这是否是最佳选择，但您可以使用代码查看 index 和然后决定下一步做什么。

这可以通过 if/else 或 switch 语句或函数 table.

来完成

// if/else
$('#my-container-div').on('onAlbumLoad', function(event, index) {
   if (index === 0) {
       func1();
   } else if (index === 1) {
       func2();
   }
});

// switch
$('#my-container-div').on('onAlbumLoad', function(event, index) {
     switch(index) {
         case 0:
             func1();
             break;
         case 1:
             func3();
             break;
     }
});


// function table
var fTable = [func1, func2, func3, func4];

$('#my-container-div').on('onAlbumLoad', function(event, index) {
    if (index < fTable.length) {
        fTable[index]();
    }
});

这些都行。

如果要比较的索引数是两个或更少，我会使用if/else。

如果索引的数量超过两个并且您正在检查一组连续的索引，我会使用函数 table 因为它更容易扩展而无需编写新代码（您只需添加数组的新函数）。

如果您要检查的索引超过两个且不连续，我可能会使用 switch 语句。

Answer 2

尝试创建对应的函数数组，每个函数对应一个index；利用 .trigger(event, [args]) 调用 "onAlbumLoad" 事件 index ；例如，0 作为参数

var fns = [
  function fn0() {
    $(this).html("a")
  },
  function fn1() {
    $(this).html("b")
  },
  function fn2() {
    $(this).html("c")
  }
];

var container = $("#my-container-div");

container.on("onAlbumLoad", function(event, index) {
  fns[index].call(this)
});

$("input").on("change", function() {
  container.trigger("onAlbumLoad", [this.value])
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="my-container-div">container</div>

<input type="checkbox" value="0" />
<input type="checkbox" value="1" />
<input type="checkbox" value="2" />

为每个索引参数分配不同的函数

Assign each index argument different function

jquery

indexof