学习要点
- 调用autocomplete()方法
- 修改autocomplete()样式
- autocomplete()方法的属性
- autocomplete()方法的事件
自动补全多用于输入邮箱,搜索关键字等等。然后提出完整的字符串供用户选择.
调用autocomplete()方法
$("#email").autocomplete({
source:['xx@163.com','bb@163.com','cc@163.com']
})
//表示只要用户输入xx后面就会出现@163.com,帮用户补全了。
autocomplete()方法的属性
- source 指定数据源可以是本地的也可以是远程的
- delay 默认是300毫秒,延迟设置
- autoFocus 设置为true的时候,第一个项目会被选定
- focus 当自动补全获取焦点,会调用focus方法。该方法有2个参数一个event,一个ui此事件中ui有两个子属性对象一个是label补全列表显示的文本,第二个value将要输入框的值。一般label与value值相同
- select 同focus
- change 也是两个参数,但是ui没有子属性
$("#email").autocomplete({
source:['xx@163.com','bbb@163.com','ccc@163.com'],
delay:50,
autoFocus:true,
focus:function(e,ui){ui.item.value='123'},
select:function(e,ui){ui.item.value='123'},
change:function(e,ui){window.alert('')},
search:function(e,ui){window.alert("")}
})