jQuery文字高亮过滤插件jcTextHighlighterFilter

所属分类:UI,输入,其他-筛选及排序,搜索,杂项

 40606  326  查看评论 (7)
分享到微信朋友圈
X
jQuery文字高亮过滤插件jcTextHighlighterFilter ie兼容7

jcTextHighlighterFilter

一款文字高亮过滤插件,可以实现用户输入字符后页面上指定区域高亮显示,当然此插件也可以部分代替浏览器自带的搜索功能。

用法:

1.首先引入所需文件

<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jcfilter.min.js"></script>

2.准备好一个输入框

<input type="text" id="filter">

3.启动插件

<script type="text/javascript">
	jQuery(document).ready(function(){
		jQuery("#filter").jcOnPageFilter({
			animateHideNShow: true,//是否启用隐藏和显示区域时的动画效果
			focusOnLoad:true,//插件启动时是否自动聚焦到输入框
			highlightColor:'#FFFF00',//高亮背景色
			textColorForHighlights:'#000000',//高亮文字色
			caseSensitive:false,//是否区分大小写
			hideNegatives:true,//是否不显示无结果的区域
			parentLookupClass:'jcorgFilterTextParent',//元素的父框架Class,如果子元素中无结果则隐藏整个框架
			childBlockClass:'jcorgFilterTextChild'//要在哪些元素中显示,元素Class名
		});
	});          
</script>
相关插件-筛选及排序,搜索,杂项

jQuery条件筛选表格(原创)

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

angular过滤搜索

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

jQuery根据条件筛选数据

jQuery根据输入关键字和选择的条件进行筛选,常用代码简单实用。
  筛选及排序
 28771  332

table 点击排序 三种方法

不用通过数据交互那么复杂,可以简单的静态排序和筛选,适用于后台数据列表等需求
  筛选及排序
 42046  365

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

    N 0
    2019/8/15 11:33:48
    按钮触发的数据怎么显示 回复
    soleil~_~程 0
    2019/4/10 14:07:44
    晚饭有鱼有肉 0
    2018/1/24 14:26:07
    输入    .      查询时出问题 回复
    晚饭有鱼有肉 0
    2018/1/24 14:25:22
    感觉丶ALONE 0
    2017/1/22 16:13:36

    如果我要筛选的是Get回来的数据呢?

    回复
    马圣博 0
    2016/12/21 9:12:36

    可以识别中文么

    回复
    马圣博 0
    2016/12/21 9:12:20

    如果我要筛选的是Get回来的数据呢?

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复