js或Jquery 根据字符串类型的方法名,找到对应的方法并且调用

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js或Jquery 根据字符串类型的方法名,找到对应的方法并且调用相关的知识,希望对你有一定的参考价值。

我自定义了一个 input 标签的属性,例如:
<input id="id1" onclick="clickFunName()" callFunc="funcName">
callFunc 是自定义属性,funcName 是方法名称,我现在需要 在js中 调用 funcName 这个方法,该如何操作?
其实这种方式 理论上肯定是可以实现的,onclick 是内置属性,他就可以将参数值转换为方法执行,自定义属性就不知道如何执行。
求大神指点不惑,感激!

可以使用js的eval函数实现,示例如下:

<script type="text/javascript">
  //自定义函数,用于弹出三个参数的值
  function alertFunc(str1,str2,str3)
       alert(str1);
       alert(str2);
       alert(str3);
   
 //自定义函数:根据传入的函数名,调用函数
 function callAlert(functionName)
      //根据函数名得到函数类型
       var  func=eval(functionName);
       //创建函数对象,并调用
      new func(arguments[1],arguments[2],arguments[3]);
  
 
 </script>
 <!--编写按钮,在点击事件中调用函数-->
 <button onclick="callAlert(\'alertFunc\',\'tom\',\'hello\',\'world\')" >测试函数调用</button>
参考技术A <!doctype html>
<html>
<head>
    <meta charset="utf-8" />
    <title>test</title>
</head>
<body>
     <input id="id1" type="button" onclick="clickFunName(this.attributes['callFunc'].nodeValue)" callFunc="funcName" value="按钮" />
     <script>
     function clickFunName(fn,args) 
        fn = eval(fn);
        fn.call(this,args);  
     
      
     function funcName()
        alert('调用funcName方法成功!');
     
     </script>
</body>
</html>

给你写个将字符串转换成方法名称并执行的demo

追问

嗯,确实是我想要的答案,运行测试果然没问题! 厉害,追问:判断是否是正确的方法字符串,如果传递进来的参数字符串不是方法名就会报错:
fn = eval(fn);

追答function clickFunName(fn,args) 
try 
fn = eval(fn);
 catch(e) 
console.log(e);
alert(fn+'方法不存在!');

if (typeof fn === 'function')
fn.call(this); 
    

本回答被提问者和网友采纳

以上是关于js或Jquery 根据字符串类型的方法名,找到对应的方法并且调用的主要内容,如果未能解决你的问题,请参考以下文章

前端--jQuery

jQuery获取设置样式

jQuery插件的使用和写法

jquery怎么根据id获取元素值

jQuery入门第二

jquery ajax中支持哪些返回类型以及js中判断一个类型常用的方法?