效果图:
第一种:从数据库中检索之后补全
第二种:邮箱等纯前端的补全
插件,所以相对简单。
github上面的项目 completer。
nofollow" href="https://github.com/fengyuanchen/completer">https://github.com/fengyuanchen/completer 做法特别容易,github上面有详细的文档。
一开始尝试用这个来配上自己的后台代码,做成第一种的自动补全,搞了半天失败了。可能本人js太差,改动太多的话,代码很复杂,除非认真研究上面这个开源项目。
主要失败在我在后台数据库找出来的完整的模糊查询得到的数据,用上面的插件只能是补全在后面,没有办法完全替换输入值。比如你输入fafe,查到fafegeg,但是下拉的表项中只能选到 fafefafegeg,因为是补全。
下面说说第一个怎么做,百度不到什么好的经验介绍,就自己按自己的思路实现了:
where(['blocked'=>$blocked])->andWhere(['type'=>$this->type])->andWhere(['like','username',$value])->all();
$result2 = User::find()->where(['blocked'=>$blocked])->andWhere(['type'=>$this->type])->andWhere(['like','email',$value])->all();
$string = '';
foreach ($result1 as $v) {
$string = $string.$v->username.',';
}
foreach ($result2 as $v) {
$string = $string.''.$v->email.',';
}
$string = $string.'';
//返回格式 类似username1,username2,email1,return $string ;
}
//前端
用户名和邮箱检索" name="value">