老师为什么只能点击一次
来源：4-2 地图搜索（2）
qq_慕瓜7049344
2020-08-12 11:06:14
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
* {
margin: 0;
padding: 0;
}
#container {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
#setCenterNode {
width: 200px;
height: 500px;
position: absolute;
top: 5px;
left: 5px;
background-color: white;
overflow:auto;
}
li {
cursor: pointer;
}
</style>
<script src="https://webapi.amap.com/maps?v=1.4.15&key=2617d7539add945232071d65fe19a4f0"></script>
<script src="js/jquery-3.1.1.min.js"></script>
</head>
<body>
<div id="container"></div>
<div id="setCenterNode">
<input type="" id="searchNode">
<ul id="uli"></ul>
</div>
<script>
var map = new AMap.Map('container', {
zoom: 11, //初始化地图的显示级别
center: [100.379391, 30.861536] //初始化地图中心点
});
//加载插件 Autocomplete地图加载完毕 触发回调函数
AMap.plugin('AMap.Autocomplete', function () {
// console.log(123);
//search 搜索 data是数据
//oninput 在用户输入时触发
searchNode.oninput = function () {
uli.innerHTML = ''
if(this.value==''){
return
}
new AMap.Autocomplete().search(this.value, function (status, data) {
console.log(data);
for (var i = 0; i < data.tips.length; i++) {
var oli = document.createElement('li');
oli.innerHTML = data.tips[i].name ;
oli.R = data.tips[i].location.lat;
oli.Q = data.tips[i].location.lng;
uli.appendChild(oli);
oli.onclick = function(e){
var event = e || window.event;
var tar = event.target || event.srcElement;
map.setCenter([oli.Q,oli.R])
}
}
});
}
});
</script>
</body>
</html>
1回答
-
好帮手慕言
2020-08-12
同学你好，在点击事件里面，应该使用this，指向当前点击的元素，如下：
如果我的回答帮到了你，欢迎采纳，祝学习愉快~
0
相似问题