老师 ， 您id为node的为什么有div的效果？不需要创建div容纳吗
来源：4-2 地图搜索（2）
js_Cz
2019-10-25 21:02:40
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.11&key=e22196035aaa10db3b0b6eb1ab64619e&plugin=AMap.Autocomplete"></script>
<style type="text/css">
*{margin: 0;padding: 0;list-style: none;}
#container{width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
#setZoomNode,#setCenterNode{width: 200px;height: 500px;position: absolute;z-index: 99;right: 20px;top: 20px;border: 1px solid black;box-shadow: 0 0 5px black;background: white;}
#setCenterNode{top: 20px;}
#node li{cursor: pointer;}
</style>
</head>
<body>
<div id="container"></div>
<div id='setCenterNode'>
<input type="" name="" id='searchText'>
</div>
<script type="text/javascript">
var map = new AMap.Map('container',{
zoom:11, //初始的地图级别
center:[100.379391,30.861536] //初始化地图的中心点
});
new AMap.Autocomplete({
input:'searchText'
});
/*
new AMap.Autocomplete().search('北京',function(status,data){
console.log(data.tips);
*/
/*
for(var i = 0;i < data.tips.length;i++){
var oLi = document.createElement('li');
oLi.innerHTML = data.tips[i].name;
oLi.P = data.tips[i].location.P;
oLi.R = data.tips[i].location.R;
node.appendChild(oLi);
oLi.onclick = function(){
// console.log(this.P,this.R)
map.setCenter([this.R,this.P]);
};
}
});
*/
//加载插件 、 Autocomplete 地图加载完毕 会触发的回调函数
AMap.plugin('AMap.Autocomplete',function(){
// console.log(1);
searchText.oninput = function(){
// console.log();
node.innerHTML = '';
if(this.value == ''){
return;
}
new AMap.Autocomplete().search(this.value,function(status,data){
console.log(data.tips);
for(var i = 0;i < data.tips.length;i++){
var oLi = document.createElement('li');
oLi.innerHTML = data.tips[i].name;
oLi.P = data.tips[i].location.P;
oLi.R = data.tips[i].location.R;
node.appendChild(oLi);
oLi.onclick = function(){
// console.log(this.P,this.R)
map.setCenter([this.R,this.P]);
};
}
});
};
});
</script>
</body>
</html>
1回答
-
好帮手慕言
2019-10-26
同学你好，id为node的元素，是一个ul标签
是可以实现效果的，不一定都要使用div。代码具有灵活性，能够实现效果，使用哪种都是可以的哦
使用同学提供的代码进行测试，是有报错的哦。因为同学的代码中没有id为node的元素，但是在js中使用了
建议：可以参考视频中老师的代码，跟着老师的节奏慢慢来哦
如果帮助到了你，欢迎采纳~祝学习愉快~
0h019-10-26
相似问题