-1

N 個の住所を取り、それらの住所を N 個の Google マップに表示できるようにしようとしています。class 属性が「canvas」に設定された N 個の div 要素があります。コードを実行すると、最後のテーブル セル要素に、必要な場所の地図が含まれています。他のテーブル セルにはマップが含まれていません。

JavaScript:

// JavaScript Document

var geocoder;
var mapOptions;
var newLocation;
var element;

$(document).ready(function()
{

    $.each($(".canvas"),function(i,value)
    {   
        element = value;
        initialize($("tr").eq(i).children("td").text());
    });
});

function initialize(tr) 
{
geocoder = new google.maps.Geocoder();
codeAddress(tr);

}

function codeAddress(address) 
{       
    geocoder.geocode({ 'address': address}, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            newLocation = results[0].geometry.location;
            mapOptions = 
            {
                center: new google.maps.LatLng(newLocation.Ya,newLocation.Za),
                zoom: 10,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            }
            map = new google.maps.Map(element, mapOptions);

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

HTML:

  <html>
      <head>
      </head>
      <body>
         <table>
             <tr>
                  <td>Address 1</td><td class="canvas"></td>
                  <td>Address 2</td><td class="canvas"></td>
                  <td>Address 3</td><td class="canvas"></td>
                  <td>Address 4</td><td class="canvas"></td>
                  <td>Address 5</td><td class="canvas"></td>
                  <td>Address 6</td><td class="canvas"></td>
             </tr>
         </table>
     </body>
  </html>
4

1 に答える 1

0

elementの各ループで上書きします$.each() 。

codeAddress代わりに引数として渡します。

$.each($(".canvas"),function(i,element)
    {   
        initialize($(element).prev().text(),element);
    });

.....

function codeAddress(address,element){
  //your code
}
于 2013-02-18T10:17:50.543 に答える