autocomplete.js 的使用示例

html内容：

<input type="text"  style=" " name="name" id="name" value="" />

<input type="hidden" style=" " name="id" id="id" value="" /> //可能并不需要显示

 

相关的jQuery内容：

第一步：(自行下载)引入autocomplete.js 

<script src="/js/jquery.autocomplete.min.js"></script>

第二步：获取涉及的全部数据

1.后台返回一个数组

 

var data = '<?php echo json_encode($all) ;?>'; // 后台这个可能渲染一个数组，可以转化为json字符串

var countries = JSON.parse(data); //由JSON字符串转换为JSON对象

2.直接本地内容

var countries = [

{ value: "苹果1", id: "1" },

{ value: "苹果2", id: "2" },

{ value: "苹果3", id: "3" }

];

 

第三步:赋值

var id ;

var name ;

$('#name').autocomplete({

lookup: countries,

onSelect: function (suggestion) {

id = suggestion.id;

name = suggestion.value;

$('#id').val(d); //将获取的内容赋值给相应的input

$('#name').val(name);

}

});

 

备注：学习阶段，不足之处希望大家多多指教