//-------------腾讯地图关键字补全----------------------------------------------
$(function() {
$( "#tags" ).autocomplete({
source: function(request,response){
var keyword = request.term;
var obj = [];
$.ajax({
url:"https://apis.map.qq.com/ws/place/v1/suggestion",
type:"get",
async:false,//关闭异步
data:{
"key":"2GDBZ-H7IC6-JC7SB-MMQY……(使用自己的key)",
"keyword":keyword,
"region":"广州",
'output': 'jsonp'
},
dataType: "jsonp",//jsonp解决跨域问题
jsonp: "callback",
jsonpCallback: "map",
headers: {
'Content-Type': 'application/json'
},
success:function(resp){
for(i in resp.data){
//此处可以根据需要自定义要显示的内容以及封装的数据
obj.push({
"label":resp.data[i].title + "("+resp.data[i].province+"-"+resp.data[i].city+"-"+resp.data[i].district+")",
"value":resp.data[i].title,
"lat":resp.data[i].location.lat,
"lng":resp.data[i].location.lng,
"nearAddr":resp.data[i].address
});
//label为提示显示的内容
//value为选中后补全出现在文本框中的内容
}
//将obj最为结果返回
response(obj);
}
});
},
minLength:1,
create: function () {
$(this).data('ui-autocomplete')._renderItem = function (ul, item) {//这里使用这个回调函数生成自定义的html内容
return $('<li>')
.append("<a href='javascript:;' class='j-change-addr j-banner-nav j-near-search' data-type='selection' data-index='4' data-lat=" + item.lat + " data-lng=" + item.lng + " data-nearAddr=" + item.nearAddr + "> <div class='gray3 mb10'>" + item.value + "</div><div class='nearAddr fs12 gray9'>" + item.nearAddr + "</div> </a>")
.appendTo(ul);
};
}
});
});
//-------------腾讯地图关键字补全----------------------------------------------