如何通过setInterval/setTimeout函数中的名称调用函数？

Question

function loadDate() 
{ 
    $.ajax({ 
     type : "POST", 
     url : "/ajax/date", 
     data : "text", 
     success : function(response) 
     { 
      $('#dateSection').html(response); 
     }, 
     error : function(e) 
     { 
      alert('Ajax Request Failed: ' + e); 
     } 
    }); 
} 

function loadPoop() 
{ 
    if(true) 

    $.ajax({ 
     type : "POST", 
     url : "/ajax/poop", 
     data : "text", 
     success : function(response) 
     { 
      $('#poopSection').html(response); 
     }, 
     error : function(e) 
     { 
      alert('Ajax Request Failed: ' + e); 
     } 
    }); 
} 

实际上，这就是我想要做的，但没有我尝试超越的JavaScript制作一个电话

function ajaxCaller(function_name) 
{ 
    setInterval(window[function_name], 1000); 
    //or 
    setInterval(function_name, 1000); 
} 

html页面

<button type="button" onclick="loadDate()">Date Button</button> 
<div id="dateSection">Ajax Me Bro!</div> 

<button type="button" onclick="ajaxCaller(loadDate())">Poop Button</button> 
<div id="poopSection">Ajax Me Bro!</div> 

<button type="button" onclick="ajaxCaller(loadPoop())">Ajax Caller Button</button> 
<div id="ajaxCallerSection">Ajax Me Bro!</div> 

Answer 1

功能的作品是第一类对象。这意味着你可以像使用任何其他普通变量一样使用它们。如果您丢失了括号中的HTML代码：

<button type="button" onclick="ajaxCaller(loadDate)">Poop Button</button> 
<div id="poopSection">Ajax Me Bro!</div> 

<button type="button" onclick="ajaxCaller(loadPoop)">Ajax Caller Button</button> 
<div id="ajaxCallerSection">Ajax Me Bro!</div> 

你告诉JavaScript的不是调用函数loadPoop或loadDate，而是直接将它传递给函数ajaxCaller作为变量。

随着括号（）你是运行loadDate，之后传递loadDate的结果来ajaxCaller第一。在这种情况下，两个loadDate和loadPoop任何回报，所以ajaxCaller也将收到什么，并没有超时被设置。

Answer 2

我认为该论点不能成为一个功能！反正只要使用以下

function ajaxCaller(value) 
{ 
if (value=="loadPoop") 


setInterval(function(){loadPoop()},1000); 

if (value=="loadPoop") 

setInterval(function(){loadDate()},1000); 
} 

，改变参数是字符串

<button type="button" onclick="ajaxCaller("loadDate")">Poop Button</button> 
<div id="poopSection">Ajax Me Bro!</div> 

<button type="button" onclick="ajaxCaller("loadPoop")">Ajax Caller Button</button> 
<div id="ajaxCallerSection">Ajax Me Bro!</div> 

我觉得这里的解决办法是更加动态，但： How to execute a JavaScript function when I have its name as a string

Answer 3

Samw的答案是正确的 - 但我想尝试在这件事上详细阐述一下。

在您的代码中，您将loadPoop（）和loadDate（）的返回值作为参数传递给ajaxCaller（）。基本上 - 第一个loadPoop（）被调用，然后它返回的值（在你的情况下什么也没有）传递给ajaxCaller（）。

在Samw的回答中，指向函数loadPoop（）和loadDate（）的指针作为参数传递，以便稍后使用function_name（）调用函数。 setInterval也发生同样的情况，你在setInterval中传递一个指向你想调用的函数的指针作为参数。

如果你觉得这些参数不是作为对象或值，但作为地址，然后这使得更多的意义 - 基本上会发生什么是代码的执行“跳跃”到内存地址（变量名是只是我们人类称之为特定的内存地址） - 并且由于一个函数在内存中的那个点开始执行 - 它只是继续。

现在这可能有点过分简化了，但希望它能让您更好地了解为什么这是好的，以及为什么您的方法不起作用。

欢迎来到指针的世界！

Answer 4

由于您使用的是jQuery，我倾向于重新使用代码来利用它。您可以分离出内联代码，这是一件好事，您可以通过传入函数参数来将ajax函数的数量减少为1。

<button type="button" data-fn="default">Date Button</button> 
<div id="dateSection">Ajax Me Bro!</div> 

<button type="button" data-fn="date">Poop Button</button> 
<div id="poopSection">Ajax Me Bro!</div> 

<button type="button" data-fn="poop">Ajax Caller Button</button> 
<div id="ajaxCallerSection">Ajax Me Bro!</div> 

$(function() { 

    function loadAjax(fn) { 
    $.ajax({ 
     type: "POST", 
     url: "/ajax/" + fn, 
     data: "text", 
     success: function (response) { 
     $('#' + type + 'Section').html(response); 
     }, 
     error : function (e) { 
     alert('Ajax Request Failed: ' + e); 
     } 
    }); 
    } 
    } 

    $('button').click(function() { 
    var fn = $(this).data('fn'); 
    switch (fn) { 
     case 'date': 
     setTimeout(function() { 
      loadAjax('date'); 
     }, 1000); 
     break; 
     case 'poop': 
     setTimeout(function() { 
      loadAjax('poop'); 
     }, 1000); 
     break; 
     default: 
     loadAjax('date'); 
     break; 
    } 
    }); 

}); 

Answer 5

声明：

function ajaxCaller(fn) { 
    setInterval(fn, 1000); 
} 

用法：

ajaxCaller(loadDate) // instead of : ajaxCaller(loadDate()) 
ajaxCaller(loadPoop) // instead of : ajaxCaller(loadPoop()) 

不要叫fn自己，让setInterval做好这项工作。