Question

$this->email->attach($this->load->view('layouts/emp_pdf',$data));

$('.dgok').click(function(){
var fn = $(this).attr('data-fn');
console.log(fn); // abc
fn();
});

function abc(){
console.log('abc');
}

.dgok{
cursor:pointer;
}

结果：<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='dgok' data-fn='abc'>OK</div>

有没有办法做到这一点？

lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum

Answer 1

动态访问函数名称通常是一种代码味道，但是如果您的abc位于顶层，则可以访问window[fnName]，其中fnName是包含函数名称的字符串。精确的变量名称是重要-您的fn不是函数，而是字符串，因此最好将其命名为一个字符串（通过尝试调用它来混淆自己的机会更少）。例如：

$('.dgok').click(function() {
  var fnName = $(this).attr('data-fn');
  window[fnName]();
});
function abc() {
  console.log('abc');
}

.dgok {
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class='dgok' data-fn='abc'>OK</div>

如果您的abc在最高级别上不是，则window[fnName]将不起作用-改用按函数名称索引的对象：

(() => {
  const fns = {
    abc: () => console.log('abc')
  };
  $('.dgok').click(function() {
    var fnName = $(this).attr('data-fn');
    fns[fnName]();
  });
})();

.dgok {
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class='dgok' data-fn='abc'>OK</div>

Answer 2

您可以使用字符串访问全局范围中的任何变量或函数。通常不建议这样做，但是可以：

window[string]();

在这里，window是一个对象，每个全局变量都是一个属性。

编辑

不建议使用此方法，因为全局变量可能导致名称冲突，并且可以从任何位置从任何函数或文件进行访问，从而使错误更难以跟踪。

顺便说一句，您可以改为使用内置的HTML onclick属性，如下所示：

function abc(){
console.log('abc');
}

.dgok{
cursor:pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class='dgok' onclick='abc()'>OK</div>

Answer 3

这将起作用：

// find elements
$('.dgok').click(function(){
var fn = $(this).attr('data-fn');
//console.log(fn);
var execute=(fn);
console.log(execute);

});

function abc(){
console.log('abc');
}

请记住，（fn）执行该函数...当您将其分配给某物时，它将调用它并将变量设置为返回值（在本例中为execute）。

触发名称为变量名的函数

3 个答案: