3

在handsontable完成加载/初始化 后，我正在尝试进行一些DOM 操作。

handsontable 是否有一些在它完成自身构建后触发的事件？

4

2 回答 2

10

无需再更改代码，因为为此内置了事件：

afterInit ()- Handsontable 实例启动后触发的回调。

afterLoadData ()- 将新数据（通过 loadData 方法）加载到数据源数组后触发回调。

afterRender ()- 渲染 Handsontable 表后触发的回调。

有关活动的完整列表，请参见此处

于 2013-06-27T13:17:36.127 回答
4

我在他们的github上找不到任何这样的回调，而且我认为你真的不需要一个。只需在调用$("#container").handsontable(). 如果是因为您使用 ajax 加载它，只需在完成时调用它。只需在此处按照他们的示例进行操作。
if (source === 'loadData') {...}

但是，如果您能够应对挑战，并且根据您下载的版本，我们可以深入研究源代码并自己进行一些调整，因为它相当简单。我假设您在handsontable 完成初始化而没有任何ajax 负载的情况下要求回调。

跟着我，让我们潜入水中。

改变在jquery.handsontable.full.js

对了，就是这样，在设置之后，就在网上2165说：

$.fn.handsontable = function (action) {...};

在那里，我们知道一切都已初始化，幸运的是，开发人员很好地评论并正确标记了他的东西，所以让我们看看里面的行。

网上2182说：

instance = new Handsontable.Core($this, currentSettings);

那里是他们初始化核心内容的地方，至少我可以从名字中看出这一点，所以在这一行之后添加一个回调就足以作为一个afterInit回调。

因此，我们需要做的就是在用户提供的设置中添加一个回调检查，然后调用它。我决定在行之后添加这个回调，2184因为它是在实例化之后。
你可以争论我把回调放在哪里，它是否应该在Core函数内部，以及我如何检查设置是否是一个函数等，但这可以完成工作，而且这样更容易。

于是，上线2182 

[...] 
instance = new Handsontable.Core($this, currentSettings); //<---- line 2182
$this.data("handsontable", instance);
instance.init(); //<---- line 2184

if(typeof(currentSettings.afterInit) == "function"){
    currentSettings.afterInit();
}
[...]

在那里，这就是我们需要做的一切！现在我们可以创建一个带有afterInit回调函数的handsontable。

$("#container").handsontable({
    startRows: 8,
    startCols: 6,
    rowHeaders: true,
    colHeaders: true,
    minSpareRows: 1,
    contextMenu: true,
    afterInit: function(){
        console.log("Handsontable initialized!");
    }
});

不要害怕弄乱源代码，你会学到很多东西！

完成修改后的代码

这是从行开始2165到2203包含$.fn.handsontable函数的完整更改代码：

$.fn.handsontable = function (action) {
  var i, ilen, args, output = [], userSettings;
  if (typeof action !== 'string') { //init
    userSettings = action || {};
    return this.each(function () {
      var $this = $(this);
      if ($this.data("handsontable")) {
        instance = $this.data("handsontable");
        instance.updateSettings(userSettings);
      }
      else {
        var currentSettings = $.extend(true, {}, settings), instance;
        for (i in userSettings) {
          if (userSettings.hasOwnProperty(i)) {
            currentSettings[i] = userSettings[i];
          }
        }
        instance = new Handsontable.Core($this, currentSettings);
        $this.data("handsontable", instance);
        instance.init();
        if(typeof(currentSettings.afterInit) == "function"){
            currentSettings.afterInit();
        }
      }
    });
  }
  else {
    args = [];
    if (arguments.length > 1) {
      for (i = 1, ilen = arguments.length; i < ilen; i++) {
        args.push(arguments[i]);
      }
    }
    this.each(function () {
      output = $(this).data("handsontable")[action].apply(this, args);
    });
    return output;
  }
};
于 2012-12-19T17:13:58.603 回答