如何在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);
        }
    });
}

這本質上是我要嘗試執行的操作，但是除了撥打一個電話外，我嘗試的所有操作均無用

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

JavaScript中的函數是一流的對象。 這意味着您可以像使用任何其他普通變量一樣使用它們。 如果您在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

Samw的答案是正確的-但我想嘗試對此事進行詳細闡述。

在您的代碼中，您要將loadPoop（）和loadDate（）的返回值作為參數傳遞給ajaxCaller（）。 基本上-首先調用loadPoop（），然后將其返回的值（在您的情況下為空）傳遞給ajaxCaller（）。

在Samw的答案中，指向函數loadPoop（）和loadDate（）的指針作為參數傳遞，允許您以后使用function_name（）調用函數。 setInterval發生了同樣的事情，您將指針傳遞給要在setInterval中作為參數調用的函數。

如果您不是將參數視為對象或值而是地址，那么這會更有意義-基本上發生的是代碼的執行“跳轉”到了內存地址（變量名就是我們的名字）調用該特定的內存地址）-並且由於函數從內存中的那個點開始執行-它就繼續進行。

現在，這可能有點過分簡化了，但是希望它可以使您更好地了解為什么可以這樣做以及為什么您的方法不起作用。

歡迎來到指針世界！

Answer 3

由於您使用的是jQuery，因此我傾向於對代碼進行一些重做以利用它。 您可以分離出內聯代碼，這是一件好事，並且可以通過傳入function參數來將ajax函數的數量減少到一個。

<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 4

宣言 ：

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

用法：

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

不要自己打電話給fn ，讓setInterval完成這項工作。

Answer 5

我認為參數不能是一個函數！ 無論如何只是使用以下

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>

我認為這里的解決方案更加動態： 我將其名稱作為字符串時如何執行JavaScript函數