加入对象属性

时间:2013-11-14 11:01:33

标签: javascript performance jquery

以下功能有效但我正在研究改进代码。我想要做的第一件事是删除“myOption”对象中的样式以加载它们之前,只留下内容,因为我需要从AJAX调用中获取数据。

function codeAddress() {
  var address = document.getElementById('address').value;
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);
      var marker = new google.maps.Marker({
          map: map,
          draggable: true,
          position: results[0].geometry.location
      });

      var marker = new google.maps.Marker({
          position: marker.position,
          map: map,
          title: results[0].formatted_address
      });
      $.ajax({
        url: url+marker.position.ob+","+marker.position.pb+"",
        dataType: "jsonp",
        success: function (data) {
          var myOptions = {
               content: template(data)
              ,disableAutoPan: true
              ,maxWidth: 0
              ,pixelOffset: new google.maps.Size(-240, 0)
              ,zIndex: null
              ,boxStyle: { 
                background: "url('tipbox.gif') no-repeat"
                ,opacity: 0.9
                ,width: "454px"
               }
              ,closeBoxMargin: "10px 10px 2px -20px"
              ,closeBoxURL: "assets/image/x.png"
              ,infoBoxClearance: new google.maps.Size(1, 1)
              ,isHidden: false
              ,pane: "floatPane"
              ,enableEventPropagation: false
          };
          var ib = new InfoBox(myOptions);
          ib.open(map, marker);
        }
      });

    } 
    else {
      alert('Geocode was not successful for the following reason: ' + status);
    }

  });
}

我正在考虑创建一个样式对象并在AJAX调用之前加载它,然后将它与包含数据的对象连接起来,而不是在“new InfoBox(NewObject)”中传递单个对象

关于如何做到这一点的任何想法或者是否有不同/更好的方法?

Full script

1 个答案:

答案 0 :(得分:1)

function codeAddress() {
  var address = document.getElementById('address').value;
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);
      /*
       * This is overwritten below
      var marker = new google.maps.Marker({
          map: map,
          draggable: true,
          position: results[0].geometry.location
      });
      */
      var marker = new google.maps.Marker({
              position: marker.position,
              map: map,
              title: results[0].formatted_address
          }),
          myOptions = {
              disableAutoPan: true,
              maxWidth: 0,
              pixelOffset: new google.maps.Size(-240, 0),
              zIndex: null,
              boxStyle: {
                  background: "url('tipbox.gif') no-repeat",
                  opacity: 0.9,
                  width: "454px"
              },
              closeBoxMargin: "10px 10px 2px -20px",
              closeBoxURL: "assets/image/x.png",
              infoBoxClearance: new google.maps.Size(1, 1),
              isHidden: false,
              pane: "floatPane",
              enableEventPropagation: false
          };

      $.ajax({
          url: url+marker.position.ob+","+marker.position.pb+"",
          dataType: "jsonp",
          success: function (data) {
              myOptions.content = template(data);
              var ib = new InfoBox(myOptions);
              ib.open(map, marker);
          }
      });

    } else {
      alert('Geocode was not successful for the following reason: ' + status);
    }

  });
}