1，这是一个比较简单的页面，你可以复制下来就可以使用。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI 自动完成（Autocomplete） - 默认功能</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css">
<script>
$(function() {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$( "#tags" ).autocomplete({
source: availableTags
});
});
</script>
</head>
<body>
<div class="ui-widget">
<label for="tags">标签：</label>
<input id="tags">
</div>
</body>
</html>
2.实战自动填充数据：
(1)页面：
$("#account_name").focus(function(){
var sel = $('#select').val();
var auto_able = !$(this).data('autocomplete');
if(auto_able)
{
$(this).autocomplete(
{
autoFocus: true,//自动获得焦点
minLength: 0,
autoFill: true, //要不要在用户选择时自动将用户当前鼠标所在的值填入到input框，Default: false
source: '__URL__/autoCompleteAccount', //这是路径，也是数据源。
select: function (event, ui) {
$("#account_name").val(ui.item.label);
window.location.href = "__URL__/order?sel="+sel+"&account_id="+ui.item.id;
return false;
}
}
);
}
});
输入框：
<input type="text" placeholder="请输入帐号名称" id="account_name" name="account_name" autocomplete="off" value="{$accountName}">
(2).控制器：
public function autoCompleteAccount(){
$flag_arr = array();
if($_GET['term']){
foreach( $this->_account as $key=>$ac){
if ( stripos( $ac , trim($_GET['term']) ) !== false )
$flag_arr[] = array(
'id' => $key,
'label' => $ac,
);
}
}
echo json_encode($flag_arr);exit; //以json的方式
}
