Skip to content

mogewcy/autocomplete

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

autocomplete

autocomplete---自动完成组件 在html文件里引入autocomplete.js即可,注意,autocomplete.jsautocomplete.css文件要放在同一目录下。 <script src='autocomplete.js></script>

该组件参照了百度,必应,搜狗等搜索引擎的自动完成框的显示效果,并基本还原

在html里写好如下结构

	<input type="text" id='search'>
	<div id="suggest">
		<ul>
		</ul>
	</div>
var auto=new Autocomplete({
         inputId:'search',
         suggestId:'suggest',
         dataSource:'demo.php',
         isShowHistory:true,
         jumpUrl:'https://www.sogou.com/web?query=',
         pageSize:5
	});

inputId是搜索框的id, suggest是搜索建议的id, dataSource是数据请求的地址,本例中为demo.php, isShowHistory是规定在搜索记录中是否显示历史记录,即以前搜索过的关键词,该数据存在, jumpUrl,对应跳转后的网址 localStorage中,所以不支持localStorage的浏览器是怎么也看不到历史记录的, pageSize是指搜索建议能显示的最大数量,本例中为5条

About

autocomplete---自动完成组件

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published