Question

我正在使用DataTables构建一个表，它使用AJAX作为它的数据源。但是，我似乎无法将函数传递给AJAX参数; $ .post（）函数（来自常规JQuery）总是在页面加载时发送我的变量评估的内容。理解JS的内部工作方式我很糟糕，所以我不确定我做错了什么。这是我的代码：

function init_datatable() {

  var url = null;
  var datasource = null;

  // Set AJAX url and data based on which page we're on
  if (window.location.pathname.indexOf("bookmarks") > -1) {
    url = "/bookmarks";
    datasource = bookmarks;
  } else {
    url = "/search";
    datasource = $('#form').serialize();
  }

  var table = $('#table').DataTable({
    "ajax" : function (data, callback, settings) {
      $.post(url, datasource, function (data) {
        callback(data);
      });
    }
  });
}

如果我直接写$.post(url, $("#form").serialize())，而不传入变量数据源中的serialize()函数，我会得到预期的结果;每次表单更改时，更新的数据都包含在POST请求中。但是，如果我按上面所述执行此操作，则datasource是页面加载时包含的表单的静态对象。我也尝试过做

datasource = function() {
  $("#form").serialize()
}

但这似乎不起作用。我如何将数据源用作静态全局对象和每次调用$.post()时需要运行的函数，具体取决于当前页面？

Answer 1

您的初始if被调用一次。那就是问题所在。需要在每个帖子中进行计算。

将它放在一个名为getdatasource（）的函数中，该函数返回它，并在最初和每个帖子中调用它：）

Answer 2

不应该这样做

function init_datatable() {
    function datasource() {
        var url = null;
        var data = null;
        // Set AJAX url and data based on which page we're on
        if (window.location.pathname.indexOf("bookmarks") > -1) {
            url = "/bookmarks";
            data = bookmarks;
        } else {
            url = "/search";
            data = $('#form').serialize();
        }
        return [url, data];
    }

    var table = $('#table').DataTable({
        "ajax": function (data, callback, settings) {
            $.post(datasource()[0], datasource()[1], function (data) {
                callback(data);
            });
        }
    });
}

Answer 3

当你在函数的第一行声明var datasource = null时，你在该函数的作用域中声明了该变量，以及嵌套在其中的任何作用域。

要更新DataTable的ajax回调中的datasource变量，您只需在回调中移动$('#form').serialize();行，如下例所示。这样，变量也将在您的顶级函数范围（init_datatable）中设置。

function init_datatable() {

  var url = null;
  var datasource = null;

  // Set AJAX url and data based on which page we're on
  if (window.location.pathname.indexOf("bookmarks") > -1) {
    url = "/bookmarks";
    datasource = bookmarks;
  } else {
    url = "/search";
  }

  var table = $('#table').DataTable({
    "ajax" : function (data, callback, settings) {
      // each time this executes your top-level datasource variable
      // will be updated here
      datasource = $('#form').serialize();

      $.post(url, datasource, function (data) {
        callback(data);
      });
    }
  });
}

如何传递对Javascript函数的引用？

3 个答案: