javascript - 使用 Chrome 的内置搜索功能时,Handsontable 未完全呈现

标签 javascript jquery google-chrome handsontable

我在使用 Chrome 的内置搜索功能时遇到了奇怪的、不一致的问题。我有大约 250 行数据要在手控台上呈现,多于无需滚动或缩小即可显示在屏幕上的数据。

http://jsfiddle.net/hU6Kz/3723/

var myData = [
    ["", "Kia", "Nissan", "Toyota", "Honda"],
    ["lots of data begins here"],
             ];

$("#exampleGrid").handsontable({
    data: myData,
    startRows: 5,
    startCols: 5,
    minSpareCols: 1,
    minSpareRows: 1,
    rowHeaders: true,
    colHeaders: true,
    contextMenu: true
});

观察,当你第一次拉起页面时,你可以向下滚动,所有数据都呈现在 handsontable 中。

现在按 control + f 调出 Chrome 的内置搜索功能。搜索 handsontable 中的任何字符。 handsontable 中的大部分数据不再呈现!偶尔,如果我搜索其他内容,数据会再次呈现,但它似乎不一致,我找不到共同的原因..

这在firefox看来不是问题,但我所在的公司断然是chrome阵营。帮助我,互联网的向导们。

最佳答案

这是因为 Handsontable 使用了一种称为“虚拟呈现”的绝妙技术,它只呈现您当前正在查看的行以及其他一些行。它使得显示“无限”多行成为可能。 ctrl+f 的问题在于它会搜索 HTML 文本,因此您将无法使用它进行搜索。

这就是为什么有一个可用的搜索插件可以返回给您所有匹配单元格的列表。从那里你可以做很多事情,比如在输入时,scrollTo 下一个可用的匹配单元格(搜索)。另一个非常著名的应用是通过重新创建数据较少的表(过滤器)来过滤行。

关于javascript - 使用 Chrome 的内置搜索功能时,Handsontable 未完全呈现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31389217/

相关文章:

javascript - 通过在日期选择器中选择日期来选择图片

javascript - Chrome 不会调整 SVG 图像的大小

javascript - 使用嵌套 json 数据的 d3 热图 : how to create grids

javascript - 创建类似这样的网站需要什么?

javascript - 如何在 typescript 中导入 template.html

asp.net - 如何在代码隐藏中检查请求是否为 ajax - ASP.NET Webforms

javascript - 如何在函数内附加 html 元素

javascript - 检测一个单词并将Class添加到正文

javascript - noscript.innerHTML 跨浏览器有不同的结果

google-chrome - 为什么 Chrome Web Developer 工具没有列出 27.0.1453.93 版本的一些 JavaScript 文件?