javascript - List.js 不适用于表格

标签 javascript html search listjs

我正在尝试使用 list.js 在表格上实现“实时”搜索。我已经在列表上成功测试(做了类似 http://listjs.com/examples/existing-list 中的示例)。但是,我无法为表复制此行为。

我已经完成了这个小代码来重现这个问题:

<!DOCTYPE html>
<html><head>
<title>Test try</title>
<meta charset="UTF-8">

<script type="text/javascript" src="list.min.js"></script>

</head><body>

<div id="payload">
<input class="search" placeholder="Search">
<table style="border: 1px solid black">
    <thead>
        <th>a</th>
        <th>b</th>
        <th>c</th>
        <th>d</th>
    </thead>
    <tbody class="list" >
        <tr>
            <td class="a">Lorem </td>
            <td class="b">ipsum </td>
            <td class="c">dolor </td>
            <td class="d">sit </td>
        </tr>
        <tr>
            <td class="a">amet</td>
            <td class="b">consectetur </td>
            <td class="c">adipiscing  </td>
            <td class="d"> elit </td>
        </tr>
    </tbody>
</table>
</div>

<script>
    var options = {ValueNames: ['a','b','c','d']};
    var searchable = new List('payload', options);
</script>

</body>
</html>

出于某种原因我无法确定,这不起作用,在 FF 中搜索字段上的任何输入都会清除表体,删除它也不会恢复表。你能帮帮我吗?

最佳答案

您在变量名 ValueNames 中有错字,应该是 valueNames。您的代码的一个工作示例在这里:http://jsfiddle.net/pTEJ3/

关于javascript - List.js 不适用于表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21704469/

相关文章:

javascript - 如何使用HTML CSS设计响应式电子商务产品卡

javascript - Jquery UI slider 和自定义样式

html - 为 html 5 准备 mp4 文件

java - RegEx:如何在 Eclipse 中查找新类的实例?

javascript - Google map 标记出现在 Chrome 中,但不出现在 Firefox 或 IE 中

javascript - 在音频播放时触发 AJAX 请求

html - 无法使用 css 设置 div 的宽度

php - 对同一用户使用 x-editable 时,一次更新 1 行且每行具有不同的值

nhibernate - 使用 NHibernate 进行复杂搜索

c# - Twitterizer - 搜索 API 示例