在初始化 HandsOntable 时摆脱 TypeError

Question

我正在检查 Handsontable for developers 我的一个项目。我试图按照他们的教程来初始化一个 handsontable 对象。但是我不断收到 TypeError。

我的代码如下-

var data = [
   ["","Ford","Volvo","Toyota","Honda"],
   ["2016", 10, 11, 12, 13],
   ["2017", 20, 11, 14, 13],
   ["2018", 30, 15, 12, 13]
];

var container = $("#example");
var hot = new Handsontable(container, {
   data: data,
   rowHeaders: true,
   colHeaders: true
});

<link href="http://docs.handsontable.com/0.25.0/bower_components/handsontable/dist/handsontable.full.css" rel="stylesheet"/>
<script src="http://docs.handsontable.com/0.25.0/bower_components/handsontable/dist/handsontable.full.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-rc1/jquery.min.js"></script>

<div id="example"></div>

演示 - https://jsfiddle.net/x1w95ndx/

过去一个小时我一直在努力寻找解决方案。如果有人告诉我正确的方向，那对我真的很有帮助。

Answer 1

问题是您传递的是 jQuery collection（一个类似数组的对象，可以包含多个元素并提供 jQuery 方法，例如 .css 和 .attr）到 Handsontable 构造函数，当它需要一个普通的 DOM 元素时。

替换：

var container = $("#example");

有：

var container = $("#example")[0];

或：

var container = document.getElementById("example");

工作示例：

var data = [
   ["","Ford","Volvo","Toyota","Honda"],
   ["2016", 10, 11, 12, 13],
   ["2017", 20, 11, 14, 13],
   ["2018", 30, 15, 12, 13]
];

var container = $("#example")[0];
var hot = new Handsontable(container, {
   data: data,
   rowHeaders: true,
   colHeaders: true
});

<link href="http://docs.handsontable.com/0.25.0/bower_components/handsontable/dist/handsontable.full.css" rel="stylesheet"/>
<script src="http://docs.handsontable.com/0.25.0/bower_components/handsontable/dist/handsontable.full.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-rc1/jquery.min.js"></script>

<div id="example"></div>

在初始化 HandsOntable 时摆脱 TypeError

Getting rid of TypeError while initializing HandsOntable

javascript

jquery

handsontable

工作示例：