如图所示：单击北美洲下面的一些请求数据
HTML代码结构：
北美国
美国南部
欧洲
非洲
亚洲
大洋洲
CSS样式：
。consixmap {位置：相对；宽度：678px；身高：335px；保证金：0汽车；背景：URL（。 / / tuanduimapbg图像，PNG）没有重复；颜色：# 000；font-family:微软雅黑}
。consixmap，。名字。condetail {显示：无；位置：绝对；Z指数：10；宽度：216px；padding: 10px；左：50%；margin-left: - 118px；顶部：54px；背景：URL（背景：URL）}；}。
。consixmap.condetail跨度{显示：块；颜色：# FFF；字体大小：14px；文本对齐：左；}
。consixmap。名字{位置：绝对；宽度：52px；身高：55px；}
。consixmap.name一{显示：块；Z指数：2；位置：绝对；填料顶部：35px；文本对齐：中心；鼠标指针；宽度：52px；高度：20px；颜色：# 000；字体大小：12px；}。
。consixmap。conmap01 {左：91px；顶部：73px；}
。consixmap.conmap01一{ background: url（。 / / beimeipicbg图像，PNG）没有重复的顶部中心；}
。consixmap.conmap02 {左：180px；顶部：213px；}
。consixmap.conmap02一{ background: url（。 / / nanmeimapbg图像，PNG）没有重复的顶部中心；}
。consixmap.conmap03 {左：339px；顶部：68px；}
。consixmap.conmap03一{ background: url（。 / / ouzhoumapbg图像，PNG）没有重复的顶部中心；}
。consixmap。conmap04 {左：327px；顶部：158px；}
。consixmap.conmap04一{ background: url（。 / / feizhoumapbg图像，PNG）没有重复的顶部中心；}
。consixmap.conmap05 {左：480px；顶部：75px；}
。consixmap.conmap05一{ background: url（。 / / yazhoumapbg图像，PNG）没有重复的顶部中心；}
。consixmap.conmap06 {左：545px；顶部：220px；}
。consixmap.conmap06一{ background: url（。 / / dayangmapbg图像，PNG）没有重复的顶部中心；}
JSON格式：
{
beimeizhou ：{
请求的JSON数据1
请求的JSON数据2
}，
nanmeizhou ：{
请求的JSON数据3
请求的JSON数据4
}，
欧洲：{
请求的JSON数据5
请求的JSON数据6
请求的JSON数据7
请求的JSON数据8
}，
飞舟：{
请求的JSON数据9
请求的JSON数据10
请求的JSON数据11
请求的JSON数据12
}，
亚洲：{
请求的JSON数据13
请求的JSON数据14
}，
大洋洲：{
请求的JSON数据15
请求的JSON数据16
}
}
JS代码：
$（文档）Ready（函数（）{）
添加映射
无功stautearr = {
beimeizhou：真实的，
nanmeizhou：真实的，
欧洲：真实的，
飞舟：真实的，
'亚洲'真实'，
'真正的'大洋洲：
}；
$（。consixmap。名称），（听到咔哒声，函数（）{（）{
无功_this =这；
无功htmlcon = ；
$（这），兄弟姐妹（名称）。儿童（。condetail ），FadeOut（500）；
$（这）。儿童（。condetail ），FadeIn（500）；
无功_name =美元（这）Attr（'data-name）；
$ ajax（{
网址：JS / schoolmap JSON 。
类型：' '，
数据：{ }，
DataType：JSON
成功：函数（数据）{
对于（数据中的var i）{
如果（_name = =我stautearr {我} = =真实）{
对于（var j = 0；j <数据{长度}；j + +）{
htmlcon + = {我} { +数据+ J }；
}
$（_this）。儿童（。condetail）。追加（htmlcon）；
我stautearr { } =假；
}
}
}，
错误：函数（）{
警报（请求失败，请检查网络）；
}
}）；
}）；
}）；
