jQuery绑定事件到动态创建的事件上

通过ajax请求 url: encodeURI("http://maps.google.cn/maps/api/geocode/json?sensor=false&address="+queryText) 返回如下json数据对象

{
   "results" : [
      {
         "address_components" : [
            {
               "long_name" : "深圳",
               "short_name" : "深圳",
               "types" : [ "locality", "political" ]
            },
            {
               "long_name" : "广东省",
               "short_name" : "广东省",
               "types" : [ "administrative_area_level_1", "political" ]
            },
            {
               "long_name" : "中国",
               "short_name" : "CN",
               "types" : [ "country", "political" ]
            }
         ],
         "formatted_address" : "中国广东省深圳",
         "geometry" : {
            "bounds" : {
               "northeast" : {
                  "lat" : 22.8617484,
                  "lng" : 114.627296
               },
               "southwest" : {
                  "lat" : 22.4450271,
                  "lng" : 113.7569184
               }
            },
            "location" : {
               "lat" : 22.543099,
               "lng" : 114.057868
            },
            "location_type" : "APPROXIMATE",
            "viewport" : {
               "northeast" : {
                  "lat" : 22.7809313,
                  "lng" : 114.3553162
               },
               "southwest" : {
                  "lat" : 22.3293893,
                  "lng" : 113.7524414
               }
            }
         },
         "types" : [ "locality", "political" ]
      },
      {
         "address_components" : [
            {
               "long_name" : "深圳",
               "short_name" : "深圳",
               "types" : [ "train_station", "transit_station", "establishment" ]
            },
            {
               "long_name" : "1008",
               "short_name" : "1008",
               "types" : [ "street_number" ]
            },
            {
               "long_name" : "建设路",
               "short_name" : "建设路",
               "types" : [ "route" ]
            },
            {
               "long_name" : "禁區",
               "short_name" : "禁區",
               "types" : [ "neighborhood", "political" ]
            },
            {
               "long_name" : "罗湖区",
               "short_name" : "罗湖区",
               "types" : [ "sublocality_level_1", "sublocality", "political" ]
            },
            {
               "long_name" : "深圳市",
               "short_name" : "深圳市",
               "types" : [ "locality", "political" ]
            },
            {
               "long_name" : "广东省",
               "short_name" : "广东省",
               "types" : [ "administrative_area_level_1", "political" ]
            },
            {
               "long_name" : "中国",
               "short_name" : "CN",
               "types" : [ "country", "political" ]
            },
            {
               "long_name" : "518001",
               "short_name" : "518001",
               "types" : [ "postal_code" ]
            }
         ],
         "formatted_address" : "中国广东省深圳市罗湖区人民南路建设路1008号深圳 邮政编码: 518001",
         "geometry" : {
            "location" : {
               "lat" : 22.531844,
               "lng" : 114.117273
            },
            "location_type" : "APPROXIMATE",
            "viewport" : {
               "northeast" : {
                  "lat" : 22.5331929802915,
                  "lng" : 114.1186219802915
               },
               "southwest" : {
                  "lat" : 22.5304950197085,
                  "lng" : 114.1159240197085
               }
            }
         },
         "types" : [ "train_station", "transit_station", "establishment" ]
      }
   ],
   "status" : "OK"
}

如上json所示，通过ajax发送请求返回的数据，然后对数据进行进一步处理

var searchResult = [];
for (var i = 0 ; i < data.results.length ; i++){
    var result = data.results[i];
    var loc = result.geometry.location;
    var mapPoint = geographicToWebMercator(loc.lng,loc.lat);
    searchResult.push({index:i,name:result.formatted_address,point:mapPoint});
}

现在我要把上面返回的json数据的地理名称显示到页面上，（也就是searchResult中的name显示），我已经对其进行了包装放在了searchResult数组中

页面如下:

<div id="searchList" >
    <div>查询结果</div>
    <!-- <button data-ng-repeat="item in searchResults" data-ng-click="searchCenterTo(item.point)">{{item.name}}</button> --> 
</div>

在另一个函数中进行处理把 searchResult 传进来

function(result){
    $("#searchList").find('button').remove();  //动态生成的每次生成前先删除
    for(var i=0; i<results.length; i++){
        /*var abc = myMap.searchCenterTo(results[i].point);
        myMap.searchCenterTo("+results[i].point+")*/
        var htm = "<button>"+results[i].name+"</button>"
        $(htm).appendTo($('#searchList'));
        $("#searchList").on('click','#searchList button:eq('+i+')',{data:results[i].point},function(e){
            myMap.searchCenterTo(e.data);
        });
    }
}    

如下生成页面

//这里对每一个生成的button动态绑定上事件，写法如上，也是写了好多次才正确，其中参考  http://www.cxy808.com/cxy/20140528/945.htm

最后button点击时传递一个对象到 searchCenterTo 方法中，

miniMap.prototype.searchCenterTo=function(point){
    console.dir(point);
    this.arcMap.centerAt(point.data,16);
}

如下图看出point的结构，它是被包装在叫一个data的数据下面，使用时就要point.data