当前路径: 星河码客 » 插件特效 » Bootstrap文字搜索特效_jQuery单页面文字搜索定位插件jquery.full-search.js

Bootstrap文字搜索特效_jQuery单页面文字搜索定位插件jquery.full-search.js

一款基于Bootstrap的单页面文字搜索jQuery插件。通过搜索关键字,插件会在下拉列表中高亮列出关键字和所在的各个段落,用户点击相应的搜索下拉列表项即可跳转到相应的地方。适用方法使用该文字搜索插件需要在页面中引入Bootstrap相关文件,以及jQuery和jquery.full-search.js文件,为了实现瞄点跳转,还需要引入anchor.js文件。 HTML结构创建一个元素用于制作搜索框。然后创建一个搜索列表的HTML模板。

最后将你需要进行搜索的内容放入一个带唯一ID号的容器中

Lorem ipsum dolor sit amet

......

Morbi fermentum

......

...
初始化插件在页面DOM元素加载完毕之后,可以通过fullsearch()方法来初始化该文字搜索插件。$('#search').fullsearch({ highlight: true, search_data: ".search-result", search_title: ".result-section", search_content: ".result-content", list: "#result-list", nodata: "没有找到相关数据"}); 配置参数highlight:是否高亮搜索关键字。search_data:搜索结果存放的容器的class类。search_title:搜索的标题容器。search_content:搜索的结果容器。list:要进行搜索的容器。nodata:没有找到结果时的提示文本。

Bootstrap文字搜索特效_jQuery单页面文字搜索定位插件jquery.full-search.js

在线演示        积分下载        6毛下载        砍两刀下载       

文件目录······
暂无数据
 猜你喜欢 更多»
 工具推荐 更多»