基于包含函数名称的字符串调用函数

时间:2010-05-04 06:22:12

标签: javascript jquery

var foo1,foo2;

switch (fn)
{
    case "fade"  : foo1 = "fadeOut"; foo2 = "fadeIn"; break;                
    case "slide" : foo1 = "slideUp"; foo2 = "slideDown"; break;
}

eval("$('.cls1')." + foo1 + "();");
currentSlideIndex = currentSlideIndex + n;
eval("$('.cls1')." + foo2 + "();");

没有使用eval可以更好地实现这一目标吗?除非绝对必要,否则我不是使用eval的忠实粉丝。

5 个答案:

答案 0 :(得分:4)

$('.cls1')[foo1]();
currentSlideIndex = currentSlideIndex + n;
$('.cls1')[foo2]();

答案 1 :(得分:4)

您无需使用eval,只需使用括号property accessor

$('.cls1')[foo1]();

答案 2 :(得分:4)

由于foo1foo2中存储的函数名称是$('.cls1')返回的对象的属性,因此以下内容应该有效:

$('.cls1')[foo1]();

foo2相同。

答案 3 :(得分:1)

您可以使用以下语法:

$('selector')[foo1]();

然而,动态调用该方法的另一种方法是创建一个新方法,用于分配

(function() {
  $.fn.someFunc = function(what)
  {
    switch(what) {
      case 'fadeOut':
        $(this).fadeOut();
        break;
        // etc
      default:
        // handle an unknown value
    }
  }
})(jQuery);

$('.cls1').someFunc('fadeOut');

这将允许您快速控制发生的事情,而不是像foo1那样传递任何内容。

答案 4 :(得分:1)

您可以使用此策略来满足您的需求:

function doFade() {
  alert('fade');
}

function doFadeIn() {
  alert('fadeIn');
}

var fns = {
  'fade': doFade
  , 'fadeIn', doFadeIn 
};

function callSomething(what) {
  fns[what]();
}

// callSomething('fadeIn'); => alerts 'fadeIn'