Question

尝试访问函数中数组的索引值。该数组有4条记录，但只访问索引1 - 3的值，数组中的最后一个值未被访问，只创建了3个标记。 Jquery抛出 TypeError：a.eb未定义和 TypeError：b未定义。数组变量是global_citizens。

错误发生在 MakeRouteCallBack 功能

处

marker[rNum] = createMarker(legs[i].start_location,"start",legs[i].start_address,ctype);

控制台打印结果

sdfsd sfsdf
fsdf sdfsdf
john wells
sdfdf dfrre

10.58909,-61.13388800000001-10.5089259,-61.3822726,2

10.66753800802045,-61.51776409679476-11.3165044,-60.53128919999999,3

10.67278501519437,-61.51673537546543-10.2690277,-61.3422372,2

10.67107578209723,-61.51689561536466-10.65,-61.4,4

Citizen icon is 2
Citizen icon is 3
Citizen icon is 4

TypeError: a.eb is undefined.......

代码：

创建标记

 function createMarker(latlng, label, html,citizenType) {

     var contentString = '<b>'+label+'</b><br>'+html;

     console.log('Citizen icon is '+citizenType);     

    //replaces if...then..else...else if. Icon source are placed in an array that corresponds to value of the citizenType.
    //array starts from 0 . The first value of the citizens type is 2 so array should have a value at the 2 location 
    //so jquery will map the icon to the citizenType based on its matching location in the array

      var markerSource = [null,
                         'resources/icons/criminal_new.ico',
                         'resources/icons/victim_new.ico',
                         'resources/icons/suspect_new.ico'];


    var icon = markerSource[citizenType];

        var marker = new google.maps.Marker({
          position: latlng,
          map: map,
          title: label,
          icon: new google.maps.MarkerImage(icon),
          zIndex: Math.round(latlng.lat()*-100000)<<5
          });
          marker.myname = label;        

      google.maps.event.addListener(marker, 'click', function() {
          infowindow.setContent(contentString); 
          infowindow.open(map,marker);
          });
      return marker;
  }

设置路线

   function setRoutes(){    

        var directionsDisplay = new Array();

        for (var i=0; i< global_citizens.length; i++){

        var rendererOptions = {
            map: map,
            suppressMarkers : true,
             preserveViewport: true
        }
        directionsService = new google.maps.DirectionsService();

        var travelMode = google.maps.DirectionsTravelMode.DRIVING;  

        console.log(global_citizens[i].startLat+','+global_citizens[i].startLng+'-'+global_citizens[i].endLat+','+global_citizens[i].endLng+','+global_citizens[i].citizenType);

        var request = {
            origin: global_citizens[i].startLat+','+global_citizens[i].startLng,
            destination: global_citizens[i].endLat+','+global_citizens[i].endLng,
            travelMode: travelMode
        };  

            directionsService.route(request,makeRouteCallback(i,directionsDisplay[i],global_citizens[i].citizenType));

        }

MakeRouteCallBack

    function makeRouteCallback(rNum, disp,ctype){   
     if (polyline[rNum] && (polyline[rNum].getMap() != null)) {
           startAnimation(rNum);
           return;
          }

        return function(response, status){      

          if (status == google.maps.DirectionsStatus.OK){

            var bounds = new google.maps.LatLngBounds();
            var route = response.routes[0];
            startLocation[rNum] = new Object();
            endLocation[rNum] = new Object();


            polyline[rNum] = new google.maps.Polyline({
            path: [],
            strokeColor: '#FFFF00',
            strokeWeight: 3
            });

            poly2[rNum] = new google.maps.Polyline({
            path: [],
            strokeColor: '#FFFF00',
            strokeWeight: 3
            });     


            // For each route, display summary information.
            var path = response.routes[0].overview_path;
            var legs = response.routes[0].legs;

            disp = new google.maps.DirectionsRenderer(rendererOptions);     
            disp.setMap(map);
            disp.setDirections(response);


            //Markers               
            for (i=0;i<legs.length;i++) {
              if (i == 0) { 
                startLocation[rNum].latlng = legs[i].start_location;
                startLocation[rNum].address = legs[i].start_address;
                // marker = google.maps.Marker({map:map,position: startLocation.latlng});


                //console.log('(i) The Citizen Type Is : '+ global_citizens[i].citizenType);
                marker[rNum] = createMarker(legs[i].start_location,"start",legs[i].start_address,ctype);                    

              }

              endLocation[rNum].latlng = legs[i].end_location;
              endLocation[rNum].address = legs[i].end_address;
              var steps = legs[i].steps;

              for (j=0;j<steps.length;j++) {
                var nextSegment = steps[j].path;                
                var nextSegment = steps[j].path;

                for (k=0;k<nextSegment.length;k++) {
                    polyline[rNum].getPath().push(nextSegment[k]);
                    //bounds.extend(nextSegment[k]);            


                }

              }
            }           
        }

         polyline[rNum].setMap(map);
         //map.fitBounds(bounds);        
        startAnimation(rNum);   

        }

    }

Answer 1

你的代码不容易理解，但是你的回调有时会返回undefined，有时会返回一个函数，这可能导致TypeError，因为当API需要函数时你可能会返回undefined ...这只是猜测虽然...

索引到数组是错误的，你的变量i取值为1 - 3，当我变成4时你在数组外索引，因此你得到一个TypeError，索引到数组应该从0开始。

Jquery访问数组索引

1 个答案: