怎么用html+js写一个div，当点击地图的标注，弹出类似于这样的div

这个div！我最想要的效果是当点击“设为起点“的时候，下面出现一个文本框，并且后面附带选项，再次点击就隐藏，分别有”设为起点“，”设为终点“，”搜索附近“，具体可以看腾讯地图效果，我希望效果一模一样，

腾讯地图链接：http://map.qq.com/
先进去试试
我财富值不够，谢谢了！

举报该问题

推荐答案推荐于2018-04-10

<html>
<head>
<title></title>
<style type="text/css">
       .content{display: none;}
</style>
</head>
<body>
<span>设为终点</span><span>设为起点</span><span>搜索附近</span>
<div class="content">1</div>
<div class="content">2</div>
<div class="content">3</div>
<script>
var _span=document.getElementsByTagName("span");
var _div=document.getElementsByTagName("div");

for (var i = 0,len=_span.length; i <len; i++) {
_span[i].index=_div[i].index=i;
        _span[i].onclick=function(){
         var ind=this.index;
        if (_div[ind].className=="content") {
         for(var j=0;j<len;j++){
                   _div[j].className="content";
         }
         _div[ind].className="";
        }else{
         _div[ind].className="content";
        }
        }
};
</script>
</body>
</html>

你看一下有什么问题

追问

基本的是能满足了！可不可以再写细一点！

温馨提示：答案为网友推荐，仅供参考

当前网址：http://22.wendadaohang.com/zd/C62I66TThSIC2Xhf2SS.html

其他回答

第1个回答 2015-10-01

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

<html>
<head>
<title></title>
<style type="text/css">
.content{display: none;}
</style>
</head>
<body>
<span>设为终点</span><span>设为起点</span><span>搜索附近</span>
<div class="content">1</div>
<div class="content">2</div>
<div class="content">3</div>
<script>
var _span=document.getElementsByTagName("span");
var _div=document.getElementsByTagName("div");

for (var i = 0,len=_span.length; i <len; i++) {
_span[i].index=_div[i].index=i;
_span[i].onclick=function(){
var ind=this.index;
if (_div[ind].className=="content") {
for(var j=0;j<len;j++){
_div[j].className="content";
}
_div[ind].className="";
}else{
_div[ind].className="content";
}
}
};
</script>
</body>
</html>

你看一下有什么问题

相似回答

大家正在搜