热点地图及jquery的ajax中json对象处理

 

         <img src="../../images/map-bg.jpg" width="370" height="526" border="0px" usemap="#Map2" />
<map name="Map2" id="Map2">
<area shape="rect" coords="199,91,241,114" href="javascript:void(0)" alt="承德" title="right"/>
<area shape="rect" alt="张家口" coords="66,131,117,149" href="javascript:void(0)" title="left" />
<area shape="rect" coords="309,173,357,193" href="javascript:void(0)" alt="秦皇岛" title="right"/>
<area shape="rect" coords="259,205,294,226" href="javascript:void(0)" alt="唐山" title="right"/>
<area shape="rect" coords="163,259,200,280" href="javascript:void(0)" alt="廊坊" title="right"/>
  <area shape="rect" coords="87,279,127,303" href="javascript:void(0)" alt="保定" title="left"/>
    <area shape="rect" coords="182,331,220,355" href="javascript:void(0)" alt="沧州" title="right"/>
      <area shape="rect" coords="44,359,94,380" href="javascript:void(0)" alt="石家庄" title="left"/>
	  <area shape="rect" coords="127,371,164,392" href="javascript:void(0)" alt="衡水" title="right"/>
        <area shape="rect" coords="72,418,108,438" href="javascript:void(0)" alt="邢台" title="left"/>
          <area shape="rect" coords="59,476,97,495" href="javascript:void(0)" alt="邯郸" title="left"/>
</map>

 

<script type="text/javascript">  
$(document).ready(function(){
  $("area").each(function(){
   $(this).mouseover(function(){
    getMapData($(this).attr("title"),$(this).attr("alt"),$(this).attr("lang"));
               // alert($(this).attr("alt"));
    }).mouseout(function(){
      $("div[id^='d_']").hide();
     });
   });
});

//取得相应市的相关数据
function getMapData(title,regionname,cityId){
 /*if(cityId=='')
  cityId=2;
  */
 
 $.ajax({
           type:'post',
           url:'showMapDataAction.do',
           data:'method=queryMapData&cityId='+cityId,
           dataType: 'json',            
           cache:false,
           success:function(data){
               //区域
               $("#regionname").text(regionname);
               //给各字段赋值
               $("#ctscry").text(eval(data.ctscry)?data.ctscry:0);
               $("#ctss").text(eval(data.ctss)?data.ctss:0);
               $("#ctxsdqbzry").text(eval(data.ctxsdqbzry)?data.ctxsdqbzry:0);
               $("#ctczcstyry").text(eval(data.ctczcstyry)?data.ctczcstyry:0);
               $("#ctqtry").text(eval(data.ctqtry)?data.ctqtry:0);
               $("#ctxsmzrs").text(eval(data.ctxsmzrs)?data.ctxsmzrs:0);
               $("#ctzybxrc").text(eval(data.ctzybxrc)?data.ctzybxrc:0);
               $("#ctdbjzrc").text(eval(data.ctdbjzrc)?data.ctdbjzrc:0);
               $("#ctywb").text(eval(data.ctywb)?data.ctywb:0);
               $("#ctyfyy").text(eval(data.ctyfyy)?data.ctyfyy:0);
               $("#ctjzgyrc").text(eval(data.ctjzgyrc)?data.ctjzgyrc:0);
               $("#ctdqlyrc").text(eval(data.ctdqlyrc)?data.ctdqlyrc:0);
               $("#ctgry").text(eval(data.ctgry)?data.ctgry:0);
               $("#ctgry_jzgyrc").text(eval(data.ctgry_jzgyrc)?data.ctgry_jzgyrc:0);
               $("#ctgry_dqlyrc").text(eval(data.ctgry_dqlyrc)?data.ctgry_dqlyrc:0);
               $("#ctls").text(eval(data.ctls)?data.ctls:0);
               $("#ctlsjnss").text(eval(data.ctlsjnss)?data.ctlsjnss:0);
               
               //判断在左边还是在右边显示相关数据
            var dom=$("#d_left").html();
               if(title=='left'){
               $("#d_left").show();
               }
               if(title=='right'){
               $("#d_right").html(dom);
               $("#d_right").show();
               }
               }
  });
}
</script>