调用以变量命名的 jQuery 函数

Posted 2023-02-19

【中文标题】调用以变量命名的 jQuery 函数

【英文标题】：calling a jQuery function named in a variable

【发布时间】：2012-01-25 04:12:54

【问题描述】：

我有几个 jQuery 函数，例如 function setOne(); setTwo(); setThree();

还有一个变量var number，分别取值“一”、“二”、“三”。

当数值为“一”时如何调用函数“setOne()”，当数值为“二”时如何调用函数“setTwo”等等...？

提前非常感谢您。任何帮助将不胜感激。

【问题讨论】：

在我看来就像普通的 javascript 函数。

【参考方案1】：

如果你的函数在全局范围内（在窗口对象上），你可以这样做：

// calls function setOne, setTwo, ... depending on number.
window["set" + number](); 

使用eval 将允许您在本地范围内运行函数：

eval("set" + number + "()");

When is JavaScript's eval() not evil?

【讨论】：

最佳答案，我接受这个，简单而有用，你完全明白我的意思！谢谢！如果你愿意，你可以投票给我的问题。

this["set" + number](); 不起作用。仅当 setX 是 this 所指的任何属性时，而不是当 setX 是局部变量时。

抱歉，但如果 number 与 bobighorus 所描述的完全一样（例如 one、two、three），那么这将产生错误，如 setone != setOne ?!

@AndreasAL 啊，谢谢！ ;) 那么为什么不从我的答案中复制该部分，以便我们也将其包含在接受的答案中:)

太棒了！恭喜

【参考方案2】：

创建name -> function 地图：

var funcs = 
    'one': setOne,
    'two': setTwo
    /*...*/
;

然后你调用函数：

funcs[number]();

【讨论】：

其实 AndreasAL 的答案更好。人们需要明白，在 JavaScript 中，一切都是字典，甚至函数也只是全局范围字典中的条目，您可以通过这种方式访问​​。

感谢您的回答 Felix，但这似乎是一个开关迭代。我需要一个像 set+number+() 这样的自动解决方案，这意味着 setOne(); .我希望我是清楚的。

@Tigraine：只有在函数是全局的情况下才有效，这通常不是一个好主意（全局命名空间污染）。

@bobighorus：好吧，您也可以将函数直接分配给对象，而不是事先定义它们。无论您是使用function setOne() ...; 还是funcs['one'] = function() ...;，都不会产生太大的影响。优点是你的代码结构更简洁，更容易理解。

@Felix Kling：您仍然可以在更深的范围内声明函数，并按照 AndreasAL 的建议使用 this[] 表示法..

【参考方案3】：

如果变量详细说明了 JQuery 函数的实际名称，并且您想将该函数应用于 DOM 元素（如“body”），则可以执行以下操作：

 $('body')['function-name']('params');

【参考方案4】：

如果您的函数在全局范围内，请尝试：

function setOne() 
  console.log('setOne called');

function setTwo() 
  console.log('setTwo called');

function setThree() 
  console.log('setThree called');


var number, funcName;

number = 'one';
funcName = 'set' + number.charAt(0).toUpperCase() + number.slice(1);
window[funcName](); // output: setOne called

number = 'two';
funcName = 'set' + number.charAt(0).toUpperCase() + number.slice(1);
window[funcName](); // output: setTwo called

number = 'three';
funcName = 'set' + number.charAt(0).toUpperCase() + number.slice(1);
window[funcName](); // output: setThree called

【参考方案5】：

就这么简单：

function hello()
    alert("hello");

var str = "hello";
eval(str+"()");

【讨论】：

是的，但我必须调用一个函数！

@bobighorus 这将调用函数 hello()... 使用 var str = "One"; eval("set" + str + "()"); 作为您的示例。您甚至可以通过这种方式设置命名参数...eval("set" + str + "(parameterName)");

【参考方案6】：

为什么要为此设置三个函数？

var number;
function setNumber(n) 
    number = n;

setNumber(1) 将数字设置为 1

setNumber(2) 会将数字设置为 2

等

【讨论】：

谢谢你的回答，但我认为你不明白我的问题...:)