jQuery过滤器插件fastLiveFilter

所属分类:UI-筛选及排序

 36556  308  查看评论 (6)
分享到微信朋友圈
X
jQuery过滤器插件fastLiveFilter ie兼容6

更新日期:2017-12-29 10:49:00

更新内容:删除多余代码。


使用方法

fastLiveFilter这是jQuery过滤器插件,超轻量级(大小只有2K),用法简单执行效率高。

包括jQuery的插件,然后初始化插件:

<script src="jquery-1.6.4.min.js"></script>
<script src="jquery.fastLiveFilter.js"></script>
<script>
    $(function() {
        $('#search_input').fastLiveFilter('#search_list');
    });
</script>

上述将与此HTML:

<input id="search_input" placeholder="Type to filter">
<ul id="search_list">
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
</ul>

选项

选项给出的第二个参数:

$(INPUT_SELECTOR).fastLiveFilter(LIST_SELECTOR, options);

可用的选项:

超时:有多少毫秒的keydown后等待过滤列表之前。默认值是0。

回调:回调方法,该方法将得到保留在列表中的项目数。

选择:默认情况下,该插件将匹配滤波器对的文字里。如果具体确定,选择将被应用到李和由此产生的文本将被代替使用。警告:使用复杂的选择可能会显著降低性能,特别是在大名单!

例如:

$('#search_input').fastLiveFilter('#search_list', {
    timeout: 200,
    callback: function(total) { $('#num_results').html(total); }
});
相关插件-筛选及排序

前端表格排序插件,支持ajax分页

jQuery前端表格排序插件,支持ajax分页,后端分页只排序当前页,或前端分页排序
  筛选及排序
 37719  366

仿当当移动端筛选

仿当当网移动端条件筛选
  筛选及排序
 40184  370

angular过滤搜索

angular主要用于对数据的过滤搜索,代码注释很全,适合新手学习
  筛选及排序
 29757  330

jQuery条件筛选表格(原创)

通过条件选择表格要显示的部分
  筛选及排序
 42121  360

讨论这个项目(6)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    361°独家记忆 0
    2019/4/26 10:11:34
    动态追加的元素怎么过滤 回复
    Rcon 0
    2017/12/29 10:40:15

    html里应用的

    <script src="http://www.jq22.com/js/jq.js"></script>

    这个文件打不开啊

        时光小屋0
        2017/12/29 10:55:52

        代码已更新,很早弄的,这个可以不用。

        Rcon0
        2017/12/29 14:55:51

        嗯呢   居然还有回复哇  这行注释了确实是没有影响呢   

        想再请问一下  就是我想添加功能 点击li标签的时候li标签上的文字比如one 怎么让li标签上的文字出现在输入框input里呢?   谢啦

    回复
    233333333333 0
    2016/2/17 13:02:57
    火狐搜索汉字会有问题 回复
    那夜不黑 0
    2015/6/9 22:06:47
    这插件可以用在什么地方啊 ?亲 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复